GeneratePress (especially with GP Premium) includes a Global Colors panel that works similarly to CSS custom properties. You define named colors once, and they cascade throughout every element, module, and template in your site. PaletteRx generates the palette; GeneratePress applies it everywhere.
How Global Colors Work in GeneratePress
Navigate to Appearance, Customize, Colors, and you will find GeneratePress's color management interface. With GP Premium, you get a Global Colors section where you can define custom named colors. Each color becomes a CSS variable that GeneratePress references throughout its template system.
The key advantage is that changing a global color updates every instance across your site instantly. This is the design system approach, and it requires getting the initial palette right.
Exporting from PaletteRx
Select GeneratePress from the WP Themes section in PaletteRx's export step. The export generates named color entries that match GeneratePress's expected format, with role-based naming (Primary, Secondary, Light Base, Dark Base) that maps to how GeneratePress organizes its color options.
Setting Up Your Colors
In the Global Colors panel, add each color from the PaletteRx export. Use the hex values provided and name each entry according to its role. GeneratePress allows as many global colors as you need, though keeping it to your core palette of 6 to 10 colors is best practice.
Once defined, these colors appear in every color picker throughout the Customizer. Select them when configuring headers, content areas, sidebars, footers, buttons, and links.
CSS Variables for Custom Styling
Beyond the Customizer presets, you can paste PaletteRx's CSS Variables output into Additional CSS for use in custom classes and child theme styling. This gives you both visual builder integration and code-level access to the same palette.