Paint an Area with a Linear Gradient

# How to: Paint an Area with a Linear Gradient

.NET Framework (current version)

This example shows how to use the LinearGradientBrush class to paint an area with a linear gradient. In the following example, the Fill of a Rectangle is painted with a diagonal linear gradient that transitions from yellow to red to blue to lime green.

## Example

```<!-- This rectangle is painted with a diagonal linear gradient. -->
<Rectangle Width="200" Height="100">
<Rectangle.Fill>
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1.0" />
</Rectangle.Fill>
</Rectangle>
```
```Rectangle diagonalFillRectangle = new Rectangle();
diagonalFillRectangle.Width = 200;
diagonalFillRectangle.Height = 100;

// Create a diagonal linear gradient with four stops.
myLinearGradientBrush.StartPoint = new Point(0,0);
myLinearGradientBrush.EndPoint = new Point(1,1);

// Use the brush to paint the rectangle.
```

The following illustration shows the gradient created by the previous example.

To create a horizontal linear gradient, change the StartPoint and EndPoint of the LinearGradientBrush to (0,0.5) and (1,0.5). In the following example, a Rectangle is painted with a horizontal linear gradient.

```<!-- This rectangle is painted with a horizontal linear gradient. -->
<Rectangle Width="200" Height="100">
<Rectangle.Fill>
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1.0" />
</Rectangle.Fill>
</Rectangle>
```
```Rectangle horizontalFillRectangle = new Rectangle();
horizontalFillRectangle.Width = 200;
horizontalFillRectangle.Height = 100;

// Create a horizontal linear gradient with four stops.
myHorizontalGradient.StartPoint = new Point(0,0.5);
myHorizontalGradient.EndPoint = new Point(1,0.5);

// Use the brush to paint the rectangle.

```

The following illustration shows the gradient created by the previous example.

To create a vertical linear gradient, change the StartPoint and EndPoint of the LinearGradientBrush to (0.5,0) and (0.5,1). In the following example, a Rectangle is painted with a vertical linear gradient.

```<!-- This rectangle is painted with a vertical gradient. -->
<Rectangle Width="200" Height="100">
<Rectangle.Fill>
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1.0" />
</Rectangle.Fill>
</Rectangle>
```
```Rectangle verticalFillRectangle = new Rectangle();
verticalFillRectangle.Width = 200;
verticalFillRectangle.Height = 100;

// Create a vertical linear gradient with four stops.
myVerticalGradient.StartPoint = new Point(0.5,0);
myVerticalGradient.EndPoint = new Point(0.5,1);

// Use the brush to paint the rectangle.