AI color systems for design teams
One prompt.
Full color system.
Generate production-ready color tokens. 50–950 shade scales, WCAG contrast validation, and export to Tailwind, Figma, or CSS.
Click a color to build a system around it
Sunset StudioAll pairs pass WCAG 2.2 AA contrast
LIVE PREVIEW
One color. Your whole product, retuned.
Pick a base color and watch how Paletta cascades it across surfaces, charts, badges, and accents — in real time.
BASE·
bg: primary-50 · border: primary-100primary-500
Monthly revenue
$48,219
text: primary-900 +12.4% vs last mo.
badge: primary-100 / primary-700$8.2k
JANFEBMARAPRMAYJUNJUL
bg: primary-600 · fg: white
ONBOARDING · STEP 2
Export your first design system this week.
bg: surface · border: neutral-200
SYSTEM
All systems normal
APIprimary-50 / primary-700Webprimary-50 / primary-700Pluginprimary-50 / primary-700
Tokens
248
+18 this week
overlay: primary-700 → primary-800
"Paletta replaced our color brainstorm meetings."
Sora Mehta
Design lead, Northwind
EPISODE 14
Designing color systems that scale
28:14
bg: primary-900
--primary-500
#6826D9
focus ring: primary-100COMPONENT · INPUT
Search projects…⌘K
button-primary: primary-600button-secondary: primary-50
SETTINGS
Weekly digest
Net new tokens
$15,989
$18,871 last period
Shades
Shade scales
Perceptually uniform 11-step scales tuned in OKLCH. Every base color gets a balanced gradient that just works.
Primary
50 — 950
#EFE8FD
#D4BEF9
#B895F5
#9D6BF1
#8141EE
#6518EA
#5312C3
#410E99
#300A70
#1E0646
#13042E
Secondary
50 — 950
#FDE8F2
#F8BFDB
#F496C4
#F06DAD
#EC4497
#E71B80
#C11469
#971053
#6E0B3C
#450726
#2D0519
Accent
50 — 950
#FEF5E7
#FCE4BB
#FAD38F
#F9C164
#F7B038
#F59F0D
#CC8308
#A16707
#754B05
#492F03
#301F02
MutedPRO
Accessibility
Accessibility lens
Every pair is checked against WCAG 2.2. We surface contrast issues before they ship — and suggest the closest passing tone.
Aa
Primary on Background
Contrast 16.34 : 1
AAA
Aa
Secondary on Background
Contrast 7.57 : 1
AAA
Aa
Accent on Surface
Contrast 4.60 : 1
AA
Aa
Primary on Muted
Contrast 6.12 : 1
AA
Aa
Background on Primary
Contrast 2.43 : 1
Fail
Aa
Accent on Primary
Contrast 2.99 : 1
Fail
Export
Ship to any stack
Copy production-ready tokens into Tailwind, CSS variables, JS, SCSS, or sync directly to Figma variables.
:root {
--color-primary: #7C3AED;
--color-secondary: #EC4899;
--color-accent: #F59E0B;
--color-muted: #10B981;
--color-background: #0EA5E9;
}Synced — last export 4s ago
Or sync directly to Figma Variables. Install plugin
Simple pricing, powerful tools
Start free. Go Pro when you’re ready to ship.
Free
For getting started
$0forever
Start generating- 5-color palettes
- 3 AI generations per day
- Hex + CSS export
- Basic contrast checker
- Color System Generator (core)
Pro
POPULARFor designers and teams shipping fast
$6.58/mo · billed $79 yearly
Go Pro- Everything in Free
- Shade scales 50–950
- 6–10 colors per palette
- Unlimited AI generations
- Tailwind + shadcn export
- Figma plugin
- Accessibility Lens (all modes)
- Full Color System exports
- Unlimited saves, no watermark
Ready to build your color system?
Free forever. No credit card. Pro when you need more.