Turn one hex code into a full five-color palette. Three recipes — balanced, soft analogous, and high-contrast accent — derive support colors, neutrals and accents from your seed in OKLCH, so everything shares its character. Ideal when a brand gives you exactly one color to work with.
Generated locally in your browser — your colors, settings and code never leave this page.
The one-color brief
“Here is our blue — build the rest” is perhaps the most common palette assignment in commercial work, and it is a derivation problem, not an inspiration problem. Given one hex, the other colors should be computable: relatives in lightness, chroma and hue that keep the seed’s character. This generator encodes three such derivations as fixed OKLCH recipes — deterministic, documentable, reproducible from the seed forever.
Anatomy of the three recipes
Balanced is the generalist: seed, a +30° support at higher lightness, a whisper-chroma neutral, a +150° accent, and a deep anchor — covering surface, support, pop and text duties. Analogous stays within ±25° for products that want calm; its light and deep members supply range without leaving the family. Contrast is the extrovert: the seed’s 180° opposite at full voice plus ink-and-paper neutrals — a two-hue system with maximal punch. Same seed, three defensible directions, ten seconds each.
Why determinism is a feature
Random palette tools cannot be cited in documentation — “regenerate until it looks like the screenshot” is not a spec. These recipes are pure functions of the seed: write “balanced recipe from #1e90ff” in the brand doc and anyone can reproduce the exact palette here, forever, URL included. Derivation beats curation wherever systems outlive their designers.
Tuning without breaking the system
When a derived role needs adjustment, adjust in the same coordinates: nudge its L or C in the OKLCH Color Generator rather than eyedropping something unrelated, and the family resemblance survives. Then re-audit the modified set in the Contrast Matrix — the recipes produce sane lightness spreads, but any hand edit re-opens the question.
One seed, three recipes
The recipes differ more than their names suggest. Dodger blue (#1e90ff) through all three, first two roles each:
| Recipe | Second role | Third role | Character |
|---|---|---|---|
| Balanced | support (hue +30°, lighter) | neutral (whisper chroma) | covers all UI duties |
| Analogous | left neighbor (−25°) | right neighbor (+25°) | calm, single-family |
| Contrast | accent (hue +180°, vivid) | ink (near-black) | maximum punch |
Same seed, three futures — and because each recipe is deterministic, all three futures are permanently reproducible from the seed hex alone. Generate all three above, screenshot them side by side, and the direction conversation with stakeholders becomes a multiple-choice question instead of a blank page.
How to use the Palette Generator From HEX
- Enter or pick your seed hex color.
- Choose a recipe: balanced, soft analogous, or high-contrast accent.
- Five named roles derive from the seed instantly.
- Export in any format.
Frequently asked questions
What does each recipe derive from my seed color?
Balanced: the seed, a hue-shifted support, a near-neutral, an opposing accent and a dark anchor – a generalist five. Analogous: the seed flanked ±25° plus a light and a deep variant – calm and cohesive. Contrast: seed, its 180° accent, ink, paper and a mid – maximal punch. All derivations happen in OKLCH so every output inherits the seed's character.
Why five colors and not more?
Five roles cover a real interface: dominant, support, neutral surface, accent, dark text/anchor. More hues rarely add information – they add coordination cost. Expand any role into a ramp with Shades and Tints when you need depth, not breadth.
Is the output deterministic?
Completely – the recipes are fixed OKLCH offsets from your seed, so the same hex and recipe always regenerate the identical palette. Safe to document, safe to share by URL.
What makes a good seed color?
Mid lightness (OKLCH L 0.5-0.75) with visible chroma gives the recipes room to move both ways. Extremely dark, light or gray seeds still work – the recipes clamp into gamut – but the derived roles will cluster closer together.
The accent feels too aggressive for my brand – what now?
Switch to the analogous recipe (no opposing hue at all), or take the balanced palette and calm the accent specifically: drop its chroma in the OKLCH Color Generator, then re-check its role. Recipes are starting grids, not verdicts.
How is this different from the Color Palette Generator?
That one invents palettes from moods with fresh randomness; this one derives a palette from a color you already have – the "brand gave me one hex" situation. Deterministic derivation versus curated luck.
Can I hand the result straight to development?
The CSS variables export names each role (–palette-seed, –palette-accent…) ready for :root, and the DTCG JSON slots into token pipelines. Rename roles to your system's vocabulary before it fossilizes into the codebase.
