Which harmony is safest for a chart palette?

Triadic or split-complementary — three or so well-spaced hues that stay distinguishable for most viewers. Avoid pure complementary (only two colors) for anything beyond an accent pair.

Why does monochromatic give five colors?

Monochromatic is a lightness scale, not a hue rotation. Five steps (−30%, −15%, base, +15%, +30%) is the common compromise — enough variation without losing the base color.

Color Harmony Generator

Color

Rotates hues around the HSL color wheel to produce the seven palettes painters and UI designers reach for. Drop a hex, get matching tones — useful when you have a brand color and need a chart palette, an accent for a CTA, or a calm analogous strip for backgrounds. The math stays in HSL so every harmony preserves the same saturation and lightness as your base, except monochromatic which deliberately shifts lightness up and down.

—

Base color

Harmony

Hue: 217°Sat: 91%Light: 60%

Swatches

#3B82F6

#F6AF3B

Hue rotation is done in HSL, which is fast but uneven perceptually. For perceptual palettes try the OKLCH picker.

How to use

Paste your brand or anchor hex into the base field (or use the color picker).
Pick the harmony that fits the use case — analogous for calm backgrounds, triadic for vivid contrast.
Copy individual hex codes or the whole comma-separated list.

Frequently asked questions

Which harmony is safest for a chart palette?: Triadic or split-complementary — three or so well-spaced hues that stay distinguishable for most viewers. Avoid pure complementary (only two colors) for anything beyond an accent pair.
Why does monochromatic give five colors?: Monochromatic is a lightness scale, not a hue rotation. Five steps (−30%, −15%, base, +15%, +30%) is the common compromise — enough variation without losing the base color.