With Astra, you can keep a uniform color scheme on your website with global color options. These colors will be applied to theme sections throughout the website.
From the WordPress dashboard navigate to Appearance > Customize > Global > Colors.
Theme Color
This is default basic color option available with the theme –
Following are the options you will find –
- Text Color – Color for body text and description on the website
- Theme Color – Color for all theme elements like button, selected text background color, etc.
- Link Color – Color for all text to which links have been added
- Link Hover Color – Hover color for all text to which links have been added
- Background (Color and Image) – This color will be applied as a background color to the body on the entire site. If you set both – color and image – make sure to adjust the opacity of the color to make the image visible.
- Improvement (*) from Astra theme and Astra Pro v2.4.0 you will find a responsive option besides the Background option.
Note:
Since version 3.7.0 Astra Theme comes with Global Color Palette feature. This feature allows you to set color palettes and control colors across your entire website from one place. For more details, you can check the “Astra Global Color Palette” article.
If you are using a page builder, you can override the above colors with the page builderโs color settings. Also, overriding the theme colors can affect your color consistency across pages. Page builder colors will be applied to your content build with the page builder. On the other side, other pages and posts (not built by that page builder) will still use the theme settings. Thus, it could happen, for example, that your text or heading font color is different on your pages (created using page builder) and your Blog Archive or Posts. It’s important to keep in mind that this should be checked, as the settings will not be automatically synced.
We provide more styling options in dedicated modules of the Astra Pro Addon plugin. Learn more about the options available with Astra Pro Colors & Background module.
Note: The setting does not work, if you have a Transparent header activated on your site. To know more about the background color of the transparent header, please check this document. If you are not sure about what transparent header is, please follow the document here.
