Your palette
Tap a colour to copy its code. Lock one to keep it while the rest change.
How these palettes are built
Colours are not drawn at random from the whole spectrum, which mostly produces combinations that clash. Each palette starts from one random hue and places the rest at even intervals around the colour wheel, with small variations in saturation and lightness. The result is a spread that stays varied without the colours fighting each other.
Locking is what turns this from a novelty into a working tool. Find one colour you want — a brand colour, a shade pulled from a photograph — lock it, and keep generating until the other four settle into something that works around it.
Choosing colours for real work
Start with one anchor
Most workable palettes have a single dominant colour carrying the identity, with the others in supporting roles. Deciding that anchor first, then locking it here, is far more productive than trying to judge five colours at once.
Mind the proportions
A common working ratio is roughly 60% of the space in a dominant base colour, 30% in a secondary, and 10% in an accent reserved for whatever needs attention. Five colours in equal measure on one page almost always looks busy. The palette is a set of options, not a quota to spend.
Do not let colour carry meaning alone
Around one in twelve men has some form of colour vision deficiency. If red and green are the only difference between "error" and "success" in an interface, a real share of people cannot read it. Pair colour with an icon, a label or a shape wherever it carries information.
Test it in context
Colours behave differently at different sizes. A saturated accent that looks striking as a large swatch can vibrate uncomfortably as small text. Try any palette at the actual size you intend to use it before committing.
The three copy formats
Hex gives a plain comma-separated list for pasting into design software such as Figma, Canva or Illustrator. RGB gives the same colours in rgb() notation. CSS produces a ready-to-paste :root block with each colour as a custom property, which drops straight into a stylesheet.
Frequently asked questions
How do I keep a colour I like?
Press Lock underneath it. Locked colours survive every later generation, so you can hold one, two or four in place while the rest change.
Can I save a palette for next time?
Copy the codes into your project or notes. Palettes are not stored between visits, because storing them would mean an account and a server, which this site does not use.
Are the palettes accessible?
Not automatically. Accessibility depends on which pairs you use together and for what, so run any text-and-background combination through the contrast checker first.
What does the spacebar do?
It generates a new palette, so you can cycle through options quickly without reaching for the mouse. It stays out of the way while you are typing in a field.
Can I use these colours commercially?
Yes. Nothing here carries a licence restriction.