Palette Generator
Complementary, analogous, triadic and more from one colour.
About Palette Generator
Palette Generator builds a colour scheme from one base colour using established harmony rules — complementary, analogous, triadic, tetradic, split-complementary and monochrome — and exports the result as CSS custom properties. The rules are shortcuts, not laws, but they reliably avoid the muddle you get from picking colours one at a time.
How to use it
- Pick a base colour, or press Random for a starting point.
- Try each scheme — the description explains what it is good for.
- Copy an individual swatch, or the whole set as CSS variables.
Questions
Which scheme should I use?
Analogous for calm, cohesive designs. Complementary when you need one colour to stand out against another. Monochrome is the safest for interfaces, where colour should carry meaning rather than decoration.
How many colours does a design need?
Fewer than you think. One dominant, one accent and a neutral covers most interfaces. Reserve extra hues for states like error and success.
Will these pass accessibility checks?
Not automatically — harmony and contrast are different things. Run any text and background pairing through the Contrast Checker.
Palette Generator is free and runs entirely in your browser. No account, no upload, no watermark, no limit on use.