Colour Harmony Generator — Complementary, Triadic, Analogous & More
Choosing colours that work together is geometry wearing a disguise: hues at fixed angles on the wheel. Give this tool one colour you love and it returns the combinations colour theory guarantees.
Six classic colour-wheel relationships computed from your base colour. Click any swatch to copy its HEX.
How to use the Colour Harmony Generator
- Pick your base colour.
- Browse the six schemes — each is labelled with its wheel rule so you learn the pattern while you use it.
- Click swatches to copy HEX values, or copy the full CSS variables block.
How it works
All schemes are hue rotations in HSL space: complementary is +180°, analogous ±30°, triadic ±120°, split-complementary +150°/+210°, square +90° steps, and monochrome keeps the hue and varies lightness. Saturation and lightness stay at your base colour’s values (except monochrome), which keeps schemes cohesive.
Worked example
A poster designer starts from the school gold. The triadic scheme hands her a teal and a berry that sing together — the Sports Day poster designs itself.
Frequently Asked Questions
Which harmony should I choose?
Complementary for bold contrast (heroes, CTAs). Analogous for calm, natural designs. Triadic for playful balance. Monochrome for the safest, most elegant result.
Why do my colours look different from the palette tool?
This tool is pure wheel maths on YOUR colour. The Palette Generator in Image Tools suggests curated combinations instead — different job, different tool.
Can I use these for print?
Yes — copy the HEX values; your print tool converts them. Keep in mind screens show colour slightly differently from ink.
Is it exact?
Yes — the angles are exact; the same base always yields the same schemes.
More Colour & CSS Generators
The visual Color Palette Generator and the basic Gradient Generator live in Loona Image Tools; this family is the CSS-developer-grade set (multi-stop gradients, exact code output).