Palette Maker

Three ways to start

Harmony rule

Pick any base colour and apply complementary, analogous, triad, tetrad, split-complementary or monochrome. Each rule previews itself against your current base, so you choose by looking rather than by remembering what the names mean.

Presets

41 hand-set palettes across eight families: architectural, earth, muted, warm, cool, vivid, dark and print. Every one runs dark to light, so the first swatch is a usable ink and the last is a usable ground.

From an image

Drop, paste or pick a photo and the five colours that make it up come back, ordered dark to light. Extraction is deterministic, so the same image always returns the same palette.

What comes out

PNG

A clean strip or a titled card at 1600, 2400 or 3200px, drawn fresh rather than screenshotted.

SVG

A flat vector strip, for a board or a drawing set.

Code

Hex list, CSS custom properties, a Tailwind colour object, or JSON with rgb, hsl and readable ink per swatch.

Want the palette applied to artwork rather than exported on its own? The Pattern Generator draws procedural patterns with their own palettes, and the Effect Engine recolours an image you already have.

Good to know

• •Runs entirely in your browser. An image you drop is decoded locally to read its colours and is never uploaded.
• •Harmony rules are the standard colour-wheel relationships, applied as hue offsets in HSL: complementary 180°, analogous ±30°, triad 120°, tetrad 90°, split-complementary 150°/210°. Monochrome holds one hue and ramps lightness.
• •Contrast ratios follow WCAG 2.1 relative luminance. AA is 4.5:1 for normal text and 3:1 for large text (18.66px bold or 24px regular); AAA is 7:1.
• •Image extraction uses median cut, which is deterministic: the same image always returns the same palette.
• •Colour is shown in sRGB on your screen. Screen colour is not print or paint colour: match against a physical swatch or a Pantone/RAL/Asian Paints fan deck before specifying a finish.

More Tools