/ TOOL · Colors

Color Palette

Generate color-wheel harmonies, build a 50–900 design-token tint scale and check WCAG contrast. HEX, RGB, HSL, swatch locking and export to CSS / JSON / PNG / SVG — all locally in your browser.

Export palette
Import from HEX list
/ FAQ

Frequently asked questions

Does this tool send my colors to a server?

No. The entire palette generator runs in pure JavaScript in your browser — harmonies, tint scale, contrast and export. Nothing is sent anywhere, there is no backend and no telemetry, and your palette is saved only locally in localStorage.

What modes does Color Palette offer?

Three: Harmonies (a 5-color palette generator from the color wheel with complementary, analogous, triadic, tetradic and monochromatic schemes), Scale (a 50–900 design-token tint scale) and Contrast (WCAG AA/AAA compliance checking).

How is WCAG contrast calculated?

Per WCAG 2.x: we compute the relative luminance of both colors (with sRGB gamma correction) and the contrast ratio (L1 + 0.05) / (L2 + 0.05). The result is compared to the thresholds: AA normal text ≥ 4.5:1, AA large ≥ 3:1, AAA normal ≥ 7:1, AAA large ≥ 4.5:1.

What is the 50–900 tint scale mode?

The scale generates 10 lightness steps of a single color (50, 100, 200 … 900) just like tokens in design systems (e.g. Tailwind). Tints go toward 50, shades toward 900. Each step has a ready-to-copy HEX, with a legibility preview on light and dark backgrounds.