Color Palette

Pick colors, generate harmonies, check WCAG contrast, and export CSS variables

Color Picker
H 210°
S 80%
L 55%
HEX
RGB
rgb(41, 121, 212)
HSL
hsl(210, 80%, 55%)
CMYK
cmyk(81, 43, 0, 17)
CSS
background: hsl(210, 80%, 55%)
Palette Generator
Contrast Checker (WCAG)
Foreground
Background
—
contrast ratio
Large Text Sample (18pt+ or 14pt bold)
Normal text sample — The quick brown fox jumps over the lazy dog. Accessibility matters for everyone using the web.
CSS Variables
Frequently Asked Questions
Does the Color Palette tool send my color data to any server?
No. All color conversions, harmony generation, and WCAG contrast calculations happen entirely in your browser. No color codes, palette data, or design information is transmitted to our servers.
What color formats and conversions are supported?
The tool provides real-time bidirectional conversion between HEX (#RRGGBB), RGB (0–255 per channel), HSL (hue, saturation, lightness), and CMYK (cyan, magenta, yellow, key). Change any one value and all other formats update instantly.
How does the WCAG contrast checker work?
The WCAG checker computes the relative luminance of two selected colors and derives their contrast ratio. A ratio of 4.5:1 is required for normal text (WCAG AA), 3:1 for large text, and 7:1 for the stricter WCAG AAA standard. The tool shows pass/fail for each level to help you build accessible colour combinations.