# Color Options

**Step 1** - you can go to any elementor edit page.

![](https://3676579953-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MGbFxd9X6wS6x8pAOzM%2F-MGfMrwJ8ux_YuhNgCAZ%2F-MGfPy6zTZ5vaExLueSN%2Fimage.png?alt=media\&token=635e691f-4064-4a97-b2b7-15e257095eb7)

**Step 2** - Site Settings >> Global Colors >>&#x20;

![](https://3676579953-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MGbFxd9X6wS6x8pAOzM%2F-MGfMrwJ8ux_YuhNgCAZ%2F-MGfPOw1wHYzX3BFKmEI%2Fimage.png?alt=media\&token=6d2ddead-d92b-4ab5-b2b6-9234112eb281)

**Step 3** - Settings color for your site

1. **Primary Color** is the main color of your site .

* Regular: original color
* Hover : color when hover items

&#x20;Example: Color Button , Color Link and some other places.

&#x20;2\. **Body Color** is color of the content text.

&#x20;Example: Color content, description ... in single blog, single product, page ...

&#x20;3\. **Heading Color** is color of heading text.

&#x20;Example: Color Title , Title Tab ...

&#x20;4\. **Border Color** is color border block.

&#x20;Example: border product block, border form input and places with borders ...

&#x20;5\. **Light Color** is color light used for sub description.

&#x20;Example: Color categories, color date time, color subtitle ...

Note: Color is sometimes used for many special places to see which colors apply correctly to what cases you can select and test.
