What Is a Good Color Contrast Ratio? (WCAG)
Contrast ratio is how designers measure whether text stands out enough from its background to be readable — including by people with low vision. The accessibility standard (WCAG) sets specific numbers to hit. Here is what they mean and how to meet them.
What contrast ratio measures
Contrast ratio compares the brightness of two colours — usually text against its background — on a scale from 1:1 (identical, invisible) to 21:1 (pure black on pure white). The higher the number, the easier the text is to read, especially for people with reduced vision or on a glary screen.
The WCAG thresholds
The WCAG standard sets minimums. For normal body text, aim for at least 4.5:1 to meet level AA, or 7:1 for the stricter AAA. Large text (roughly 18pt, or 14pt bold) gets an easier bar: 3:1 for AA. Falling below these is the single most common accessibility failure on the web.
Large text gets an easier bar
Bigger, heavier letters are legible at lower contrast, which is why large text only needs 3:1. That is useful for headings and display type, but do not lean on it for the paragraphs people actually read — those should clear 4.5:1.
Why it matters
Low contrast excludes real users: people with low vision, colour vision deficiency, or anyone squinting at a phone in sunlight. It is also a legal requirement in many places. The Color Contrast Checker here reports the exact ratio between any two colours and whether they pass AA and AAA.
Frequently asked questions
Does grey text on white pass? Often not — light grey on white is a frequent failure; check the actual ratio rather than trusting your eye.
Do icons and UI need contrast too? Yes — meaningful graphics and controls should clear 3:1 against their background.
Can contrast be too high? Pure black on pure white can cause glare for some; a very dark grey on off-white is often more comfortable while still passing.
Related tools
Last updated: August 27, 2026