Color palette generator

Pick a brand color and get an eleven-shade scale, from 50 to 950, plus its complementary, analogous and triadic colors. You can copy each color or the whole scale as CSS variables.

Base color

Complementary
#1CD6E3

Analogous −30°
#E31C73

Analogous +30°
#E38C1C

Triadic
#1CE329

It runs in your browser. Nothing you enter is sent to any server.

How to use the scale

Light shades (50–200) work for backgrounds, mid shades (400–600) for buttons and accents, and dark shades (700–950) for text. Always check the contrast before using a color pair for text.

Color contrastCheck whether your text and background combination meets WCAG 2.2: 4.5:1 for normal text and 3:1 for large text at level AA. With live preview.Use for free→

Type scaleSet a base size and a ratio to get every heading and text size for your site, with preview and CSS variables.Use for free→

Shall we talk?

Tell us about your product and current setup and we'll send a written proposal with phases, scope and every cost.

Write to us See plans