---
description: Set primary color, second color, body, heading color for page
---

# Color

**Step 1** - You can go to any **Elementor** edit page.

![](https://gblobscdn.gitbook.com/assets%2F-MHy5dy5uQ67W56zMcvB%2F-MHyl5tKwxIFMrcOFEGL%2F-MHylCQG8lFl_ND3H8Om%2Fimage.png?alt=media\&token=2f10648c-373f-4f17-83a7-655815f0239f)

**Step 2** - Site Settings >> Global Colors

![](https://gblobscdn.gitbook.com/assets%2F-MHy5dy5uQ67W56zMcvB%2F-MHyl5tKwxIFMrcOFEGL%2F-MHylHWBwZyT9rlzwzTp%2Fimage.png?alt=media\&token=5dd4160c-9ad4-4930-945e-c68b46f693aa)

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

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

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

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

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

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

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

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

&#x20;4\. **Border Color** is the 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.
