Good colour combinations are rarely found by trial and error. They come from starting with one colour and using a simple structure to choose the rest. Two ideas do most of the work: harmony, which tells you which colours, and proportion, which tells you how much of each.
Harmony: which colours
A colour harmony is a rule based on position around the colour wheel. Pick your starting colour, and the harmony tells you where the others sit.
- Analogous — colours within about 40° of each other, wheel neighbours. They share a family feel and almost never clash, which makes them the safe, calm choice. A palette of blues shading into teals and greens is analogous.
- Complementary — colours directly opposite, 180° apart. Maximum contrast and energy. The catch is that they fight if used in equal amounts, so one must dominate and the other must accent. Blue and orange is the classic pair.
- Triadic — three colours evenly spaced 120° apart. Balanced and vivid, but demanding: give all three equal weight and it looks like a toy. Choose one to lead.
- Monochromatic — one hue, varied only by lightness and saturation. The most reliable for interfaces, because the design’s structure, not its colour, does the work of separating things.
If you are unsure, analogous or monochromatic will almost never look wrong. Complementary and triadic have more impact but need a firmer hand.
Proportion: how much of each
This is the part beginners miss, and it matters more than the exact colours. Even a perfect harmony looks amateurish when the colours are used in equal amounts, because nothing leads and the eye has nowhere to rest.
The 60-30-10 rule is the fix:
- 60% a dominant colour — usually a neutral or a soft version of your main colour. This is the background the design sits on.
- 30% a secondary colour that supports and contrasts with the dominant.
- 10% an accent — the loud one, used only for the things you want noticed, like a call to action.
The proportions are a guide, not a measurement. The point is the hierarchy: one colour clearly in charge, one supporting, one for emphasis. That structure is what makes a palette feel deliberate instead of assembled.
Do not forget the neutral
Almost every real palette needs a colour the “colours” advice tends to skip: a neutral for text, backgrounds, borders and everything structural.
Pure grey works, but a neutral tinted very slightly toward your main colour usually sits better — a barely-warm grey under a warm palette, a barely-cool one under a cool palette. It is the colour you will use most, even though nobody notices it, which is exactly why it is worth getting right.
A practical order of work
- Choose one colour you are confident about — often a brand colour or the mood you are after.
- Pick a harmony to generate the supporting colours. Analogous for calm, complementary for contrast.
- Assign roles — dominant, secondary, accent — rather than treating the colours as equals.
- Add a neutral for text and structure, lightly tinted toward the palette.
- Check contrast for every text-on-background pairing, and remember mid-tone colours often fail against each other.
- Test for colour blindness if colour carries any meaning.
Start from one colour, use the wheel to find the rest, set proportions with intent, and check the result against real constraints. That sequence produces better palettes far more reliably than picking swatches until something looks nice.