> For the complete documentation index, see [llms.txt](https://docs.lottielab.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.lottielab.com/editor/properties/fill-color/gradient.md).

# Gradient

Gradients allow you to add a blend of colours on your shape. 

Lottielab currently provides two types of gradients, [Linear](/editor/properties/fill-color/gradient/linear-gradient.md) and [Radial](/editor/properties/fill-color/gradient/radial-gradient.md), and these determine the pattern by which colour spreads from one point to another.

To control how this blend happens, the [gradient stops](/editor/properties/fill-color/gradient/gradient-stops.md) allow you to select the colour at each point and [gradient handles](/editor/properties/fill-color/gradient/gradient-handles-width-and-direction.md) determine the length and direction of the gradient spread.

{% content-ref url="/pages/dBbqNeSpg04a8fZpaMsA" %}
[Linear gradient](/editor/properties/fill-color/gradient/linear-gradient.md)
{% endcontent-ref %}

{% content-ref url="/pages/Bp0UPTy843QHJnnfDJEU" %}
[Radial gradient](/editor/properties/fill-color/gradient/radial-gradient.md)
{% endcontent-ref %}

{% content-ref url="/pages/pXLYvQsVxIdMpUlqxA9p" %}
[Gradient stops](/editor/properties/fill-color/gradient/gradient-stops.md)
{% endcontent-ref %}

{% content-ref url="/pages/pjYIsVqGefbstn9GUzWV" %}
[Gradient handles (width and direction)](/editor/properties/fill-color/gradient/gradient-handles-width-and-direction.md)
{% endcontent-ref %}