Check text contrast before someone files a complaint

Light gray on white looks fine on your monitor and is illegible on half of your users' phones. WCAG's AA and AAA levels are the objective check.

Tools used in this guide

The job

You picked a text color and a background and need to know if the combination is readable enough — before a user, a reviewer, or an accessibility audit says otherwise. WCAG 2.x defines the thresholds; this tool measures your pair against them.

What the levels mean

AA normal text needs 4.5:1 — the usual minimum for body text. AA large text (roughly 18 pt / 24 px, or 14 pt bold) needs only 3:1. AAA raises these to 7:1 and 4.5:1 — the target for anything elderly readers or low-vision users must read.

Worked example

Body text #767676 on #ffffff gives 4.54:1 — AA normal passes, AAA normal fails. Dropping to #595959 gives 7.00:1 — both pass. The checker shows all four verdicts at once, plus a live preview of the pair.

Enter colors as hex, rgb(), or hsl() — the pickers give you hex.
The ratio is symmetric: text-on-background and background-on-text are the same check.

Limits

This measures color contrast only — it does not evaluate font, size, weight, or readability beyond the WCAG formula, and it does not check focus indicators, images of text, or interactive states. WCAG 3 (APCA) uses a different model; this is the 2.x luminance formula most regulations still reference.