Global Colors & Style
1 min read0 viewsUpdated on September 3, 2026
Change the site-wide color palette from Elementor's Global Colors.
Every kit ships with a small set of Global Colors — typically a primary color, a secondary/accent color, and text colors — that every page, button, and section pulls from instead of having colors hard-coded individually. That's what makes rebranding a kit fast: change the primary color once, and every button, link, and highlighted section across all 15+ pages updates automatically, rather than you needing to manually recolor each one.
Open any page in Elementor (click Edit with Elementor).
Click the hamburger menu in the top-left corner of the editor panel.
Select Site Settings, then Global Colors.
Click any existing color swatch to change it — type in your brand's exact hex code for a precise match, or use the color picker.
Save, then check a few different pages to confirm the update applied everywhere you expected.
💡 Tip
If your brand doesn't have official hex codes yet, that's worth sorting out before this step — even approximating "close enough" colors from a logo screenshot is better than leaving the demo palette in place, since mismatched colors are one of the fastest ways a site reads as "unfinished."