// free tool · /tools/color-palette
UI Color Palette & Contrast Generator
Drop in your brand hex. We'll spin up a cohesive 5-color modern UI palette and grade every pairing against WCAG 2.1 AA & AAA contrast - instantly, in your browser.
Try:
Preview
Real UI surfaces rendered with your palette.
[K]
Dashboard · Reports · Settings
// MRR · last 30 days
$48,210 +12.4%
Your palette in a real product surface - headings, body copy, muted text, primary CTAs, and accent highlights.
WCAG contrast matrix
Every foreground vs every background. AA = 4.5:1 body / 3:1 large. AAA = 7:1 body / 4.5:1 large.
Export
Copy-paste into your design system in seconds.
Why designers use this
- One-input palettes. Type a brand hex, get a balanced 5-color system: background, surface, text, accent, and highlight.
- WCAG built in. Every pairing is scored against AA and AAA so you don't ship inaccessible UI.
- Designer-ready exports. CSS variables, Tailwind theme tokens, or raw JSON - pick your stack.
- 100% browser-side. No uploads, no signups, no tracking - palettes never leave your laptop.