Combining colors
How many colors?
The risk of using too many colors is greater than the risk of using too few. Too many creates visual noise; too few risks feeling flat — but flat is easier to fix than chaos.
A reliable starting point is three colors in defined roles:
Primary color — the dominant color. It sets the tone and occupies the most area.
Secondary color — supports the primary and is usually close to it on the wheel (analogous) or a muted variation.
Accent color — used sparingly for emphasis: buttons, links, highlights, alerts. Often a complementary or split-complementary hue to create strategic contrast.
Analogous
Analogous palettes feel calm and cohesive. The trade-off is low contrast — they work well for backgrounds and overall tone, but you'll usually need an accent from elsewhere on the wheel to create visual interest and direct the eye.
Complementary
Used at full saturation and equal proportion, complementary pairs can vibrate and feel aggressive. The key is imbalance: use one as the dominant color and the other sparingly as an accent. Adjusting the value and saturation of one or both colors also tames the vibration while keeping the energy.
Split complementary
Triadic
At full saturation, triadic combinations can feel loud. Desaturating one or two of the three colors creates a more refined result.
Tetradic (square)
Tetradic palettes are most effective when treated as two complementary pairs, with one pair dominant and the other subordinate.
Monochromatic
The risk is monotony. Counteract it with strong value contrast (pair very light tints with very dark shades) and consider adding pure white, black, or a single accent from elsewhere on the wheel to break the uniformity.
Achromatic
No hue at all — only blacks, whites, and grays. Achromatic palettes feel sophisticated and timeless, but can read as cold or stark. Adding a single chromatic accent — one vivid color — transforms an achromatic scheme from minimal to striking. This is one of the most effective design patterns: neutral everything, one color that means something.
Putting it into practice
These combinations are starting points, not formulas. In real design work, you'll adjust saturation, value, and proportion to fit the context. A triadic palette at full saturation looks like a children's toy; the same three hues at varied saturations and values can look elegant.
Explore combinations interactively with our color wizard or color wheel tool.