> For the complete documentation index, see [llms.txt](https://halosoft.gitbook.io/ella-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://halosoft.gitbook.io/ella-documentation/basic-configuration/online-store-2.0/color-gradient.md).

# Color Gradient

You can set up a gradient of colors in Ella Theme for visually interesting background options.&#x20;

<figure><img src="/files/PXJmjJVh8wWylnbkqCZO" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
To learn more about gradients and CSS backgrounds, refer to [Mozilla's linear gradient](https://developer.mozilla.org/fr/docs/Web/CSS/gradient/linear-gradient\(\)) and [CSS background](https://developer.mozilla.org/en-US/docs/Web/CSS/background) documentation.
{% endhint %}

## How to setup gradients?

1. From your Shopify admin, go to **Online Store** **->** **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Select one of the gradient options.

{% hint style="info" %}

* If you haven't set up a color gradient yet, several preset options are displayed for you to choose. Select any preset gradients to open the option panel.
* If you've already set up a color gradient, then click a gradient option to open the option panel directly.
* If you did set up a mono color and want to change to gradient, please remove the color code in CSS code field. Next, click a gradient option to open the option panel directly.
  {% endhint %}
