Why derive instead of hand-picking
A palette built from one base hue with a fixed rule stays coherent as the interface grows. Hand-picked colors drift, and eventually two of them sit close enough to look like a mistake rather than a choice.
The three usable rules are complementary at 180 degrees for contrast, analogous within 60 degrees for calm cohesion, and triadic at 120 degrees for distinguishable categories.
Shades matter more than hues
In most interfaces the brand hue covers less than a tenth of the pixels. Everything else is a lightness step of that hue: surface, border, muted text, body text. Generating five steps of one hue gives you the whole system.
Working from a lightness ladder also makes dark mode a mechanical inversion rather than a second design pass, which is the difference between a theme that ships and one that never does.
Frequently asked questions
How many colors should a palette have?
One base hue with five lightness steps, plus one accent for calls to action, plus semantic colors for success, warning and error. Anything beyond that is usually decoration.
Are complementary colors safe for text?
Rarely. Complementary pairs are chosen for hue contrast, not luminance contrast, so check the pair with a contrast checker before using it for text.
More free tools
Related guides
Related searches
color palette generatorcomplementary colorsanalogous colorstriadic palettecolor scheme generator