Color Converter
Convert colors between HEX, RGB, HSL, and CMYK, and check WCAG contrast ratios.
AA normal text: Pass · AA large text: Pass · AAA: Fail
The quick brown fox jumps over the lazy dog.
About the Color Converter
Every color format here describes the same light, just with different math. HEX and RGB both store three 0-255 channels — HEX writes them as two hex digits each (e.g. #3366cc is R=51, G=102, B=204), while RGB writes them as plain decimal numbers. HSL re-expresses those same channels as hue (0-360° around a color wheel), saturation (0-100% vividness), and lightness (0-100% from black to white) — easier to reason about when you want "the same color but darker" or "more muted". CMYK approximates how a printer would mix cyan, magenta, yellow, and black inks to produce the color, derived from RGB by first finding the darkest channel (K), then scaling the rest against it.
To use it: pick a color with the swatch or type a hex value directly, then set a background color to test contrast. The contrast ratio follows the WCAG formula — relative luminance of each color, compared as (lighter + 0.05) / (darker + 0.05) — and is checked against three thresholds: 4.5:1 for AA normal text, 3:1 for AA large text, and 7:1 for AAA. For example, #3366cc text on a #ffffff background gives a ratio around 5.1:1 — enough to pass AA for any text size, but not quite AAA for normal text.