Palettes calibrated for dashboards & branded docs
Startup-heavy moods exaggerate cobalt trust lines, noir luxury velvets, or AI gradient stories so SaaS dashboards, pitch collateral, invoices, PDFs share one coherent chroma storyline.
Free tool
Built for modern SaaS branding: hierarchical swatches (primary, secondary, accent, ink, surface) with restrained saturation — not five loud competitors. Tweak harmony, pick a brand preset, lock what you love.
Palette
Creative workspace
Presets lean minimal and premium: most swatches stay muted, one accent brings energy. Everything runs offline in your browser.
Primary
#4d688f
Prefer white text · 5.69:1 AA-ready text
W 5.69 · B 3.69
Secondary
#7e7e94
Prefer black text · 5.30:1 AA-ready text
W 3.96 · B 5.30
Accent
#906f5d
Prefer black text · 4.62:1 AA-ready text
W 4.55 · B 4.62
Neutral · text
#1e2229
Prefer white text · 15.96:1 AA-ready text
W 15.96 · B 1.32
Neutral · surface
#eff7ff
Prefer black text · 19.42:1 AA-ready text
W 1.08 · B 19.42
Recommended typography & borders
Acme Workspace
Revenue automation
Active
24.5k
Growth
3.2%
MRR
€12.4k
Analytics snapshot
Dig into Invoicey’s calculators, converters, validators, and free invoicing toolkit—we ship new utilities frequently.
Workflow
Three quick steps from input to a result you can use in your stack.
Step 1
Choose how secondary and accent hues relate to the primary (balanced, complementary, analogous, triadic, tetradic, or split), then pick a brand preset inspired by leading product design systems.
Step 2
Lock swatches you want to keep, shuffle the rest to explore seeds, use the creative prompt to bias toward coherence (Stripe, Linear, Scandinavian calm, clay UI, editorial, etc.).
Step 3
Copy semantic `:root` variables (colors + typography tokens), Tailwind stubs, structured JSON including roles, PNG strip, SCSS vars, or a shareable HEX URL.
Why teams use it
Overview
Startup-heavy moods exaggerate cobalt trust lines, noir luxury velvets, or AI gradient stories so SaaS dashboards, pitch collateral, invoices, PDFs share one coherent chroma storyline.
Designers handshake tokens between Figma, VS Code themes, Shopify CSS scopes, Laravel mailers, Cursor experiments, Storybook playgrounds, avoiding manual hex spreadsheets or Slack dumps.
If you dislike hex algebra, conversational prompts—“neo-brutalist pop”, “earthy granola”, “fintech cobalt”—skew hue/saturation jitter so solo founders iterate palettes like they would with an art director.
Answers
Five slots mirror real systems: dominant primary brand color, calibrated secondary companion, small accent punch, darker neutral for text/UI chrome, lighter neutral for canvas and cards—all OKLCH-tuned so chroma ramps feel controlled.
You can copy bundled CSS variables, Tailwind stubs, structured JSON palettes, concise SCSS maps, flat HEX stacks, raster PNG palettes for decks/Pinterest boards, plus URL encoding for async reviews.
Every swatch cites whether plain white versus black typography wins and prints the luminance-derived contrast ratio so you can sanity-check headings, KPI numerals, and CTA lettering before shipping UX.
The prompt biases brand presets plus keyword heuristics (fintech cobalt, Scandinavian air, Stripe-violet corridors, monochrome devtools) toward coherent systems—not random rainbow confetti.
Share URLs embed swatch order and generator settings inside query strings so stakeholders reload the workspace with the same harmonies, moods, locks, and shuffles you approved.
Discover more
Jump to another free utility at the same quality level. No signup wall.