Color Wheel & Color Scheme Generator

Apply the classic harmony rules — monochrome, complementary, analogous, triadic, split complementary, tetradic — to your base color and export the result.

Color picker

Choose the base color for your scheme.

#2457D6
223°
72%
49%
#2457D6
rgb(36, 87, 214)
hsl(223, 72%, 49%)

Color wheel schemes

Classic color-harmony rules applied to your base color.

How do the harmony rules differ?

Monochrome varies lightness at a single hue and is the safest choice. Complementary sits 180° apart for strong contrast. Analogous uses neighbours within ±30° for a calm result. Triadic places three hues 120° apart. Split complementary pairs the base with the two neighbours of its complement. Tetradic uses four hues 90° apart.

Do the generated hues shift?

Each rule except monochrome rotates hue by a fixed angle and adjusts saturation and lightness relative to your base color, so the scheme stays coordinated while keeping clear visual hierarchy.

Color harmony rules, and when each one works

A color wheel arranges hues around a circle. Harmony rules are simply fixed angular relationships on that circle, which is why they produce combinations that feel intentional instead of arbitrary. Below is what each rule gives you and where it tends to succeed.

Monochrome (one hue)

One hue at several lightness levels. This is the lowest-risk option and the one most interfaces should start from: it is impossible to clash, and it produces clean hierarchy through lightness alone. Use it for dashboards, documentation and anything where the content matters more than the color.

Complementary (180°)

Opposite hues give maximum contrast, which is exactly why they need care. Complementary pairs are excellent for a single call-to-action against a calm background, and tiring when applied to large areas. A common technique is to desaturate or lighten one side rather than using both at full strength.

Analogous (±30°)

Neighbouring hues read as calm and natural — think sunset gradients and nature photography. Because the contrast between them is low, pick one as the dominant hue, use the others as support, and add a neutral or a dark tone so the layout still has structure.

Triadic (120°)

Three evenly spaced hues give a lively, balanced result. It is a favourite for illustrations, charts and playful brands. In product UI, restraint matters: let one hue dominate (roughly the 60-30-10 split) and use the other two for accents.

Split complementary (150° / 210°)

Instead of the exact opposite hue, this uses the two neighbours of the complement. You keep most of the contrast of a complementary scheme with considerably less tension, which makes it easier to use across larger surfaces.

Tetradic / square (90°)

Four hues spaced evenly around the wheel. It offers the richest palette and the highest risk of visual noise; it works best when one color clearly dominates and the others are used sparingly, for example for chart series that must be distinguishable at a glance.

Practical checklist

Pick one hue as the lead and let it carry about 60% of the visual weight. Keep saturation consistent across the scheme — mixing a vivid hue with a muted one is the most common reason a generated scheme looks wrong. Add at least one near-neutral for text and surfaces. Finally, verify each text pair with the contrast checker: harmony rules optimise for aesthetics, not for readability.

When you are exploring rather than deciding, the random palette generator is a fast way to see a lot of coordinated options; the palette generator is the better choice when you already have a base color and need a usable scale.

Frequently asked questions

What is the difference between the color harmony rules?

Monochrome varies lightness at one hue and is the safest option. Complementary sits 180° away for maximum contrast. Analogous uses neighbours within ±30° for a calm look. Triadic spaces three hues 120° apart. Split complementary uses the two neighbours of the complement. Tetradic uses four hues 90° apart.

Do the generated hues shift from my base color?

Every rule except monochrome rotates hue by a fixed angle and adjusts saturation and lightness relative to your base color, so the scheme stays coordinated while keeping visible hierarchy.