You can manage the global color settings of your website from:
Appearance → Customize → Colors
General Color Settings #
- Background Color – Sets the main background color of the website.
- Primary Color – Main theme color used for buttons, links, and highlights.
- Primary Foreground Color – Text/icon color displayed on primary color backgrounds.
- Secondary Color – Secondary accent color used across the theme.
- Secondary Foreground Color – Text/icon color displayed on secondary color backgrounds.
- Page Content Background – Background color of the main content area.
- Drawer Background – Background color of drawer panels (menu drawer, search drawer, etc.).
- Drawer Text Color – Text color inside drawer areas.
- Drawer Border Color – Border color used within drawer components.
Header & Footer Colors #
In addition to global colors, you can customize colors specifically for different sections:
- Header Colors – Available under Header
- Footer Colors – Available under Footer
These section-specific settings allow you to override global colors and create more customized designs for your header and footer areas.
Tip: Use consistent primary and secondary colors to maintain a strong visual identity across your website.