Component Color Settings
A quick-edit panel that lets the agent tune the primary, secondary, accent, and surface colors for every widget without writing CSS.
What it does
A quick-edit panel that lets the agent tune the primary, secondary, accent, and surface colors for every widget without writing CSS. Sits between Themed Widget Skins (preset themes) and Custom CSS Themes (full custom CSS) for the common case of "I just need to match the brand's hex codes."
Key capabilities
- Color picker for primary / secondary / accent / surface / text roles
- Live preview of widget impact
- Saves to CSS custom properties (no inline-style hacks)
- Compatible with all themes
Good to know
- Limited to the documented color roles; fine-grained per-component coloring requires Custom CSS Themes
- Some themes intentionally restrict certain color overrides for legibility
Why teams choose this
-
Brand colors in seconds, without any CSS knowledge
-
Cascades to every widget, so you skip per-widget color tweaks
-
Foundation for deeper customization without locking the agent in