Text Contrast Checker
Check if your text is readable against any background. Enter text and background colors and instantly see the WCAG contrast ratio plus pass/fail for AA and AAA.
Large heading sample
Normal body text sample. This is how your text will look at regular size on the chosen background.
14.32:1
WCAG Contrast Ratio
AA Normal (≥4.5:1)
Pass
AA Large (≥3:1)
Pass
AAA Normal (≥7:1)
Pass
AAA Large (≥4.5:1)
Pass
What Is Text Contrast?
Text contrast measures how distinguishable text is from its background. Low contrast text is difficult to read for everyone, and impossible for users with low vision, color blindness or anyone viewing a screen in bright light. WCAG defines numeric thresholds that determine when text is considered readable.
Quick Rules of Thumb
- Body text (16px, regular weight) needs at least 4.5:1 — most professional sites use 7:1 or higher.
- Headings (24px+, or 18.66px bold) need at least 3:1 for AA.
- Placeholder text is often too light — check it explicitly.
- Text on images must be checked against the actual pixel values the text overlaps.
- Links in body text need their own contrast check plus a non-color cue (underline, bold, etc.).