October 7th, 2009

Using gradients in Blend

Blend supports gradients on onjects, strokes and text. To add a gradient to an object, first select the object you want to add it to, then go to the ‘Properties‘ tab. Under the ‘Brushes‘ section, select whether you want to effect the Fill (1) or the stroke (2) property, then choose the gradient icon (3). See image below for references.

Select fill

Select stroke

Fill type: Gradient

Fill type: None

Fill type: Solid

Color palette

Gradient stops

Select linear gradient

Select radial gradient

Reverse gradient stops

Select gradient stop

Position selected gradient stop

The default number of colors in a gradient is two. To add more gradient stops click anywhere along the color bar (7). To remove a gradient stop, click and drag the gradient stop off the color bar.

You can choose between ‘Linear‘ (8) and ‘Radial‘ (9) gradients by pressing the relevant icon in the bottom right of the ‘Brushes‘ options.

You can reverse all the colors by pressing the ‘Reverse‘ (10) icon to the right of the radial (9) button.

You can fine tune the positions of each gradient stop by using the ‘Gradient stop selector‘ (11) and the ‘Position bar‘ (12).

Change the angle, start position and end point of a gradient

Select the ‘Gradient Tool‘ on the main tool bar.

Now click on the item you want to edit and you should get an arrow tool appear like below.

The arrow tool shows the start and end point of the gradient and all the gradient stop colors and positions. The tool can be dragged and positioned to tweak your gradient. To rotate the gradient, move the mouse just past either end of the arrow until you get the rotate icon, then click and drag to rotate.

You can also use the ‘Gradient Transform‘ tool to fine tune your gradients look. Hold the mouse down on the ‘Gradient Tool‘ in the main tool bar and then select the ‘Gradient Transform‘ icon to switch modes.

Now select the object you want to effect and you will get a visual representation of the gradients boundaries to transform.