Triadic Colors
Three hues evenly spaced 120° apart on the color wheel. Triads are vibrant and balanced — and among the most demanding harmonies to use well.
The two classic triads
Both triads below use hues 120° apart. They are the two most-referenced triads in color theory.
Primary triad
Red / Yellow / Blue — the traditional primary triad, energetic and classic.
Secondary triad
Orange / Green / Violet — the traditional secondary triad, playful and balanced.
The 120° rule
On the HSL color wheel, triadic colors sit at three angles that differ by exactly 120°. Once you know one hue, the other two are easy to compute:
hue2 = (hue1 + 120) % 360
hue3 = (hue1 + 240) % 360For example, red at 0° → triad members at 120° (green) and 240° (blue). Violet at 275° → triad members at 35° (amber) and 155° (spring green).
Why triads feel energetic
Because the eye has to reconcile three different hue families at once. Analogous and monochromatic palettes stay within one family; triadic palettes spread across the entire wheel. That gives them more energy than the other harmonies — and more chance of a chaotic result if they are not managed carefully.
How to use triads well
-
Assign dominancePick one of the three hues as the dominant — usually 60–70% of the visual surface.
-
Assign an accentThe second hue covers roughly 25–30% of the surface — enough to be seen but not competing with the dominant.
-
Reserve the third as a highlightUse the third hue sparingly — 5–10% of the surface — for icons, badges, alerts or key actions.
-
Reduce saturation in two of the threeFull-saturation triads vibrate. Muting at least two of the three hues produces a more refined result.
-
Add neutralsA triad almost always needs a neutral gray scale for surfaces, text and borders — otherwise the three colors fight for space.
Practical examples
- Children’s brands — the primary triad (red/yellow/blue) is a staple because it feels playful and optimistic.
- Illustration palettes — triads give illustrations natural variety without looking random.
- Data visualization — three distinct but balanced category colors.
- Event and campaign graphics — triads feel festive and attention-grabbing.
Frequently asked questions
What are triadic colors?
Three hues evenly spaced 120° apart on the color wheel. Because the three sit at the vertices of an equilateral triangle, they are balanced in visual weight. Classic triads are red/yellow/blue and orange/green/violet.
How do I find a triadic color scheme?
Pick any base hue, then add the hues at +120° and +240°. Those three colors form a triad. For example, red at 0°, green at 120° and blue at 240° make up the classic primary triad.
Why are triadic palettes so vibrant?
Because the eye has to reconcile three distinct hue families at once. This creates more visual energy than analogous or monochromatic palettes — and also makes triads harder to manage.
How do I use triadic colors without chaos?
Choose one color as the dominant, one as a secondary accent, and the third as a small highlight. Reduce saturation in at least two of the three hues and add a neutral gray scale for surfaces and text.