Skip to content
WebTricks

Contrast checker

Check color contrast for accessibility. Get the WCAG 2.1 ratio and APCA value with AA/AAA pass-fail for normal and large text.

Large text sample

Normal body text sample — the quick brown fox jumps over the lazy dog.

WCAG 2.1 ratio
5.32
AA normal AA large AAA normal AAA large
APCA (Lc)
80.9

WCAG 3 candidate. Rough guide: ≥60 for body text, ≥45 for large.

About this contrast checker

Check whether a foreground/background color pair is readable for everyone. Enter two colors and get the WCAG 2.1 contrast ratio with clear pass/fail badges for AA and AAA at both normal and large text sizes, plus the APCA value. A live preview shows real sample text so you can judge it visually too.

Why it matters

Low contrast is one of the most common accessibility failures. Meeting WCAG contrast makes your text legible for users with low vision, on cheap screens, and in bright sunlight — and it’s required by many accessibility standards.

FAQ

What contrast ratio do I need?

WCAG AA requires 4.5 to 1 for normal text and 3 to 1 for large text. AAA is stricter at 7 to 1 and 4.5 to 1.

What is APCA?

APCA is a newer contrast model (the WCAG 3 candidate) that better reflects perceived readability, especially for thin fonts and dark mode.