Skip to content
DevKit Labs

Color Palette & Scheme Generator

Generate complementary, analogous, triadic and monochromatic palettes from a base color — in your browser.

Base color

Complementary

opposite hue

Analogous

neighbouring hues

Triadic

evenly spaced ×3

Tetradic

evenly spaced ×4

Split-complementary

base + two near-opposite

Monochromatic

same hue, varied lightness

About Color Palette & Scheme Generator

Pick a base color and instantly get the classic colour-harmony schemes built around it: complementary, analogous, triadic, tetradic, split-complementary and monochromatic. Each scheme is shown as a row of swatches with its hex code, and you can copy a single colour or the whole scheme, or click a swatch to make it the new base.

The harmonies are computed by rotating the hue (and, for monochromatic, varying lightness) in HSL, the same way designers build palettes. Everything runs locally in your browser; nothing is uploaded.

From indigo

Input
#4f46e5
Output
Complementary: #4f46e5 + #dce53e · Triadic: #4f46e5, #e5464f, #46e54f

Click any swatch to use it as the new base color.

Frequently asked questions

Which colour schemes does it generate?

Complementary, analogous, triadic, tetradic (square), split-complementary and monochromatic — the standard colour-wheel harmonies.

How are the palettes calculated?

By rotating the base color's hue on the colour wheel in HSL (e.g. +180° for complementary, ±30° for analogous) and varying lightness for the monochromatic set.

What colour inputs are accepted?

HEX, rgb(), hsl() and CSS named colours, or pick one with the swatch. Copy any generated colour's hex with one click.

Is anything uploaded?

No. All palettes are generated locally in your browser.

Related tools

References