Colour Relationships
Colours gain meaning and impact through their relationships — complementary, analogous, and triadic schemes are systematic ways to build harmony that holds under variation.
No colour exists in isolation. Every colour you place in a design is perceived relative to the colours surrounding it — a phenomenon Josef Albers called the “interaction of colour.” Colour harmony systems — complementary, analogous, triadic — are not aesthetic conventions. They are descriptions of which hue relationships create stable, coherent visual experiences versus which create tension, conflict, or muddy neutrality.
Complementary pairs
Complementary colours sit opposite each other on the colour wheel, roughly 180° apart. Blue and orange. Red and green. Purple and yellow. When placed side by side, complementary colours create maximum hue contrast — each makes the other appear more vivid by contrast. This is why a small orange accent on a blue background feels so alive.
Complementary pairs are powerful but can be fatiguing if both colours are used at full saturation in equal proportion. The effective approach is to give one colour dominance and use the other as an accent — which is exactly the logic behind 60-30-10 proportion. Our site uses amber (warm) as the accent against slate-blue (cool), a soft complementary relationship.
Analogous groups
Analogous colours are neighbours on the colour wheel — typically spanning no more than 60–90°. Blue-green, blue, and blue-purple. Orange, yellow-orange, and yellow. Because they share a hue family, analogous schemes are inherently harmonious: the eye doesn’t have to work to reconcile competing hue signals.
Analogous palettes read as calm, unified, and professional. They’re common in finance, healthcare, and productivity software — contexts where stability and clarity matter more than excitement. The risk is monotony: analogous schemes can feel flat without deliberate variation in saturation and value. A highly saturated primary with desaturated secondaries and a near-neutral background creates richness from an analogous palette.
Triadic schemes
A triadic scheme uses three colours evenly spaced around the colour wheel — 120° apart. Red, yellow, blue. Orange, green, violet. Triadic schemes are energetic and balanced: all three primary hue families are present, creating richness without any single hue dominating.
Triadic palettes are harder to pull off than complementary or analogous schemes because they introduce more hue complexity. The key is the same as with complementary: don’t use all three at equal weight. One colour should dominate, one should support, and one should appear sparingly as an accent. When well-executed, triadic palettes feel vibrant and complete — they’re common in brand identity for consumer products, entertainment, and children’s design.
Choosing a scheme
The scheme that works best depends on what the interface needs to communicate. Analogous = calm, unified, trustworthy. Complementary = focused, high-energy, with clear hierarchy. Triadic = vibrant, complex, rich. Most effective design systems use a hybrid: an analogous family for the primary palette (neutrals + a brand hue) with a complementary accent for calls to action and emphasis.
Whatever scheme you choose, remember that building a palette is not about picking colours you like — it’s about defining roles and constraints. The relationship scheme tells you which hues to use; the palette structure tells you what each hue is for.