Kadence Theme and Kadence Blocks include a sophisticated global color palette system that goes beyond what most WordPress themes offer. It provides a palette of 9 configurable color slots that cascade through the entire theme and all Kadence Blocks.
Kadence's 9-Color System
Kadence organizes its global palette into 9 positions: Accent, Accent Hover, Strong Text, Medium Text, Subtle Text, Subtle Background, Base Background, Base Border, and a ninth customizable slot. Each position has a specific function in the theme, and every Kadence Block references these positions by number.
Mapping PaletteRx to Kadence
The natural mapping: PaletteRx Primary maps to Kadence Accent. A darker variant of primary maps to Accent Hover. PaletteRx Dark Base maps to Strong Text. A mid-gray from your palette maps to Medium Text. A lighter gray maps to Subtle Text. PaletteRx Light Base maps to Subtle Background and Base Background. A border gray maps to Base Border.
Configuration Steps
Go to Appearance, then Customize, then Colors and Fonts, then Colors. Switch to the Custom Palette tab. Enter your PaletteRx hex values in each of the 9 positions. Click Publish. Every Kadence Block and theme element updates instantly.
Kadence + CSS Variables
Kadence generates CSS custom properties from its palette: --global-palette1 through --global-palette9. You can also add your PaletteRx CSS Variables export to the Custom CSS section for more semantically named variables. Both sets of variables are available in any custom CSS.