Loona Automation logoLoona Design Studio
Home › Design Tools › Colour Harmony Generator

Colour Harmony Generator — Complementary, Triadic, Analogous & More

In short: the Colour Harmony Generator applies the six classic colour-wheel rules to your base colour — complementary, analogous, triadic, split-complementary, square and monochrome — so every scheme is harmonious by geometry, not guesswork.

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.

Private by design: everything in this tool happens 100% in your browser with JavaScript. Your data, photos and designs are never uploaded to a server, never stored and never seen by us - close the tab and everything is gone.

How to use the Colour Harmony Generator

  1. Pick your base colour.
  2. Browse the six schemes — each is labelled with its wheel rule so you learn the pattern while you use it.
  3. 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).

Embed this tool on your website — free

Add this tool to your own website or blog — it is completely free, needs no sign-up, and always shows the latest version. Copy the code below and paste it into your page where you want the tool to appear. Keeping the small “Powered by Loona Automation” credit line under the embed helps keep this tool free — but you are free to style or remove it; the tool works either way.