Low contrast between text and its background is one of the most common accessibility problems I find on business websites. Enter two colors below to see the contrast ratio and whether it meets the WCAG 2.2 thresholds. The check runs in your browser, and nothing you enter is sent to me or stored.
Normal text sample (16px): The quick brown fox jumps over the lazy dog.
Large text sample (24px bold)
0:1
| Requirement | Needed | Result |
|---|---|---|
| AA: normal text | 4.5:1 | |
| AA: large text | 3:1 | |
| AAA: normal text | 7:1 | |
| AAA: large text | 4.5:1 | |
| AA: UI components and graphics | 3:1 |
How to read the results
WCAG 2.2 Level AA, the level most accessibility laws and legal settlements point to, asks for a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. Large text means 18 point (about 24px) or larger, or 14 point (about 18.5px) and bold. Level AAA asks for 7:1 and 4.5:1. Buttons, form field borders, icons and chart elements that are needed to understand a page need at least 3:1 against the colors next to them.
The ratio is not rounded up. A result of 4.499:1 fails the 4.5:1 requirement, so the tool shows the value truncated to two decimals and never shows a pass that the real value would not earn.
What this tool does not check
It compares two flat colors. Text over a photo, gradient or video needs a manual check at the weakest spot behind the text. Disabled controls, logos and decorative elements are exempt from the contrast rules. Passing contrast is one requirement among many, so this is a helpful check and not a compliance certificate. For the wider picture, read my guide to ADA, the Equality Act and WCAG for US and UK businesses.
If your site fails this check in several places, I can audit it and fix the problems at the source. See my accessibility and ADA compliance services, or contact me with your site address.
Thresholds from WCAG 2.2 success criteria 1.4.3, 1.4.6 and 1.4.11. Last checked: November 2026.