Color Converter & Contrast Checker
🔒 Runs in your browser
WCAG contrast checker
Sample heading
This is body text shown in your chosen foreground colour on the chosen background, so you can judge real legibility, not just the ratio.
Four formats, one input
Type or paste any CSS color — hex, rgb(), hsl(), oklch()
or a named color like rebeccapurple — and see it re-formatted in all four at once,
each with a one-click copy button. OKLCH is the modern pick: unlike HSL, equal steps
in lightness or chroma look perceptually uniform to the eye, and it can express colors outside
the older sRGB gamut that hex and rgb() are limited to.
WCAG contrast, computed exactly
The contrast checker computes the exact WCAG 2.x ratio between any two colors and shows a pass/fail pill for each threshold: AA requires at least 4.5:1 for normal text (3:1 for large text, 18pt or 14pt bold and up), and AAA raises the bar to 7:1 for normal text. The live preview box renders your exact fg/bg pair so you can see, not just read, whether the pairing is legible.
Frequently asked questions
Which color formats are supported?
Hex, rgb()/rgba(), hsl()/hsla(), OKLCH and CSS named colors (e.g. rebeccapurple) as input; the result is always shown in all four — hex, RGB, HSL and OKLCH. OKLCH is the modern pick: unlike HSL, equal steps in lightness or chroma look perceptually uniform, and it can express colors outside the older sRGB gamut.
What do AA, AA Large and AAA mean?
WCAG contrast thresholds for text against its background: AA requires at least 4.5:1 for normal text (3:1 for large text — 18pt, or 14pt bold, and up), and AAA raises the bar to 7:1 for normal text. The checker computes the exact ratio and shows a pass/fail pill for each level.
Can I pick a color straight from the screen?
Yes, if your browser supports the EyeDropper API (Chrome, Edge and other Chromium-based browsers) — a picker button lets you sample any pixel on screen. Firefox and Safari currently lack this API, so the button is hidden there, and you can still type or paste any color value.