Color palette
Your color palette defines the personality of every room buyers see. Set this well and you never have to think about it again.
⚠️ Requires org role Admin. Go to Settings → Branding → Color Palette.
Two palettes, two scopes
Branding settings holds two color palettes, and they do different jobs.
Workspace palette — Settings → Branding → Color Palette
The workspace-level defaults, five swatches:
Color | Where it shows up |
|---|---|
Primary Color | Main CTAs, active state in navigation, brand-anchored elements |
Secondary Color | Supporting CTAs, accents, borders |
Accent Color | Highlights, badges, status pills |
Background Color | Page background |
Surface Color | Cards, panels and other raised surfaces sitting on the background |
Theme palette — Settings → Branding → Room Themes → (theme) → Color Palette
Each room theme carries its own palette, and this is the one rooms actually render:
Color | Notes |
|---|---|
Primary Color | Labelled Buttons & Icons. Supports a gradient instead of a flat color |
Secondary Color | Supports a gradient |
Accent Color | Supports a gradient |
Background Color | Room page background |
Text Color | Default body text color — the swatch that carries the contrast check |
Any picker can also be set to transparent.
How to pick colors that work
Grab them from your brand guide. If your marketing team has a formal palette, use those exact hex values. Consistency beats creativity here.
No brand guide? Pick:
- Primary — a bold, distinctive color you're happy to see on every CTA (often your logo's dominant color)
- Secondary — a complementary second option, usually a different hue or a darker/lighter shade
- Accent — a pop color that draws the eye to status indicators and badges
- Background — almost always white or a near-white neutral for rooms (#FFFFFF or #F8F8F8)
- Text — very dark grey or black for readability (#111 or #000)
Contrast matters
The Text Color picker inside a room theme's palette shows a live contrast badge: the measured ratio against that theme's background color, plus a pass/warn/fail indicator.
Aim for:
- AA (4.5:1) for normal text — legible for most readers
- AAA (7:1) for best practice, especially if your audience includes older buyers or people with low vision
Below 4.5:1 the badge fails; between 4.5:1 and 7:1 it warns. Fix it by adjusting either the text or background color.
Previewing changes
Use the eye icon on a theme row to open Preview theme and see the palette applied before you commit. Nothing is live until you click Save changes in the bar at the bottom of the page.
Related articles
Updated on: 01/10/2026
Thank you!
