WCAG AAA contrast: what 7:1 really costs
Level AAA raises the bar to 7:1 for normal text and 4.5:1 for large text. It is the level that genuinely helps readers with low vision — and the level the W3C explicitly says should not be required across a whole site. Here is where the line falls, and where it is worth crossing. Test any pair against AAA below.
What level AAA requires
1.4.6 Contrast (Enhanced) — level AAA
Text and images of text need a contrast ratio of at least 7:1, except:
- Large text — 24px (18pt) regular or 18.66px (14pt) bold and above — needs 4.5:1.
- Incidental text and logotypes are exempt, exactly as at AA.
Notice the structure: the AAA large-text threshold (4.5:1) is identical to the AA normal-text threshold. That is the neatest way to remember the whole system — each step up the ladder shifts one rung.
| Text size | Level AA (1.4.3) | Level AAA (1.4.6) |
|---|---|---|
| Normal (< 24px regular, < 18.66px bold) | 4.5:1 | 7:1 |
| Large (24px+ regular, 18.66px+ bold) | 3:1 | 4.5:1 |
| UI components and meaningful graphics | 3:1 | No AAA criterion — 3:1 still applies via 1.4.11 |
There is no AAA version of non-text contrast. 1.4.11 only exists at AA. So a “AAA site” still only owes 3:1 on input borders and icons. If you are chasing AAA for readers with low vision, raising your control borders past 3:1 is a better use of effort than the last half-point on body text.
What 7:1 costs you in colour
The jump from 4.5:1 to 7:1 removes far more of the palette than the numbers suggest, because luminance is not linear in hex value.
- On pure white, the lightest neutral grey that passes AA is #767676 (4.54:1). The lightest that passes AAA is #595959 (7.00:1) — nearly a third darker.
- Every mid-tone brand colour that just squeaked past AA on white now fails. Bootstrap blue #0D6EFD with white text is 4.50:1 — AA yes, AAA no, and the AAA-compliant version of that blue is dark enough that most brand owners will refuse it.
- Teal #0F766E on white is 5.47:1: comfortably AA, short of AAA. Dropping to #0D645D gets you 7.00:1.
- Colour-coded status systems get hard. Warning amber and success green both have to become dark enough that they stop reading as amber and green.
In practice a AAA palette tends to converge on near-blacks, deep navies and deep greens on white, or near-whites on deep backgrounds. That can be beautiful and it is unambiguously more readable — but it is a design decision with real consequences, not a checkbox.
Should you target AAA?
The W3C's own guidance in Understanding Conformance says it is not recommended to require AAA conformance as a general policy for entire sites, because it is not possible to satisfy all AAA criteria for some content. That statement is about the full AAA set — which includes things like sign language interpretation for all prerecorded audio — but it is routinely quoted as a reason to ignore AAA contrast specifically, which is a mistake. Contrast is one of the cheapest AAA criteria to meet.
Aim for AAA when
- Reading is the product. Long-form articles, documentation, legal text, medical instructions, e-readers. If people stare at your body copy for twenty minutes, give them 7:1.
- Your audience skews older. Contrast sensitivity declines measurably with age; the difference between 4.5:1 and 7:1 is much more noticeable at 70 than at 25.
- The viewing environment is bad. Outdoor kiosks, in-car displays, warehouse tablets, phones in sunlight, cheap projectors in bright rooms. The 21:1 ceiling assumes an ideal display; real ones deliver far less.
- You are in a regulated or high-stakes domain. Government services, healthcare, banking, utilities, emergency information.
- It is nearly free. If your body text is already #1C2430 on white (15.62:1), you are past AAA without trying. Claim it.
Stay at AA when
- Brand colour is contractually fixed and the AAA-compliant variant is unrecognisable.
- You would have to abandon a large, established design system — the risk of a rushed palette migration usually outweighs the gain.
- Your remaining accessibility budget would do more good elsewhere: keyboard traps, missing labels, unusable error handling and untested screen-reader flows all break people harder than 5:1 body text does.
A pragmatic middle path
Most mature teams end up here: AAA for body copy and anything read at length, AA everywhere else. That means near-black paragraph text at 12–16:1, AA-compliant brand colours on buttons and headings, and no attempt to force the whole palette past 7:1. It is honest to describe as “AA conformant, with AAA contrast on body text”, and it delivers most of the real-world benefit.
Pitfalls specific to AAA
- Over-correcting into glare. Pushing everything toward pure black on pure white maximises the ratio and can make text harder to read for people with dyslexia, migraine or light sensitivity, who report halation at extreme contrast. 12:1 on a very slightly off-white surface is usually a better outcome than 21:1.
- Forgetting dark mode. WCAG 2.x is polarity-blind and is widely considered over-permissive for light-on-dark. A dark-mode pair can hit 7:1 numerically and still bloom badly at small sizes. Check it with your eyes as well as the calculator.
- Assuming large text is safe. AAA large text needs 4.5:1 — the same as AA body text. A heading colour chosen against the 3:1 AA large-text rule will fail AAA.
- Claiming AAA on the strength of contrast alone. AAA is a full conformance level with many other criteria. Say “AAA contrast” if that is what you mean; do not say “AAA conformant”.
- Sitting on the line. 7.00:1 is a pass, but it is one rounding decision away from an argument. Give yourself 7.3:1 or better and the question never comes up.
AAA questions people actually ask
Is AAA legally required anywhere?
Essentially nowhere as a blanket requirement. EN 301 549, Section 508 and the overwhelming majority of national regulations and settlements reference level AA. Some individual public-sector procurement documents ask for specific AAA criteria on specific content types, but a general AAA mandate is rare and, per W3C guidance, ill-advised.
Can I meet AAA contrast but not AAA overall?
Yes, and it is a completely normal position. Conformance claims are made per level across a whole page, so you would claim AA conformance and note separately that 1.4.6 is also satisfied. That is accurate and useful information for anyone evaluating your product.
Does AAA apply to placeholder text and error messages?
Yes — both are ordinary visible text, so at AAA they need 7:1 unless they qualify as large text. Error text in particular is often set small and in a mid red; #B91C1C on white is 6.47:1, which passes AA but misses AAA. Darkening it slightly fixes that.
Why is the AAA large-text threshold the same as the AA normal threshold?
Because the underlying research treats increased size as roughly equivalent to increased contrast for legibility purposes. Bigger glyphs have thicker strokes and more area, so they tolerate lower contrast. The 4.5 / 3 and 7 / 4.5 pairs encode that trade-off, and the overlap is deliberate rather than a coincidence.
Does AAA make my site accessible to everyone with low vision?
No. WCAG itself notes that the 7:1 figure was chosen to compensate for roughly 20/80 vision — people with more significant loss will still rely on magnification, zoom, high-contrast modes or screen readers. High contrast helps a lot, but it does not remove the need for your layout to survive 400% zoom and reflow.
What is the highest ratio I can actually reach?
21:1 exactly, from #000000 on #FFFFFF. The +0.05 constants in the formula represent ambient light reflecting off the screen, which is what keeps the maximum finite. No sRGB pair can exceed it.