WCAG 2.2 color contrast checker: AA + AAA validation.
Color contrast is the most-litigated accessibility failure in 2026. ADA Title III lawsuit filings exceeded 4,000 in 2025 alone, with insufficient contrast cited in the majority of complaints. WCAG 2.2 AA requires 4.5:1 contrast for normal text and 3:1 for large text. AAA tightens to 7:1 and 4.5:1. Federal procurement under Section 508 requires AA conformance minimum.
About this tool.
WCAG 2.2 Level AA requires a contrast ratio of at least 4.5:1 for normal-size text and 3:1 for large text (18pt or 14pt bold and above). Level AAA tightens these to 7:1 and 4.5:1 respectively. Federal procurement under Section 508 references WCAG 2.0 AA as the baseline; in practice, 2026-era federal contractors target WCAG 2.2 AA to future-proof.
Contrast failures are the single most-cited accessibility failure in ADA Title III lawsuits. 2025 filings exceeded 4,000 nationally, with serial-litigant plaintiffs in Florida and California targeting small business websites specifically. Insufficient contrast typically triggers a settlement demand in the $5,000 to $15,000 range — cheaper than litigating, expensive to be hit by repeatedly.
The contrast ratio formula comes from the W3C WCAG specification: it's the relative luminance of the lighter color plus 0.05, divided by the relative luminance of the darker color plus 0.05. Relative luminance accounts for human perception of color brightness — green appears brighter than blue at the same RGB value, so the calculation weights the channels accordingly.
This tool calculates contrast precisely using the official WCAG formula. The same calculation powers the contrast checks in Chrome DevTools, axe-core, Pa11y, and Lighthouse. Numerical agreement with those tools is exact to at least two decimal places.
Real-world design implications: pure white (#FFFFFF) on pure black (#000000) gives 21:1 contrast — maximum. Light gray (#888888) on white gives only 3.94:1, which fails AA for normal text but passes for large text. Yellow on white is essentially unreadable (around 1.07:1). Always test designs at the actual color values used in production, not just at design-system theory colors.
ThatDeveloperGuy applies Section 508 + WCAG 2.2 AA automatic checks to every site we build via axe-core in CI plus manual review with NVDA, JAWS, and VoiceOver. We deliver a VPAT (Voluntary Product Accessibility Template) with every federal-grade engagement documenting conformance with each WCAG 2.2 AA success criterion. See /services/section-508-compliance/ for the full methodology.
FAQ.
What's the minimum contrast for legal compliance?
WCAG 2.2 Level AA: 4.5:1 for normal text, 3:1 for large text. This is the floor for ADA Title III defense and Section 508 conformance. AAA (7:1 / 4.5:1) is preferred but not legally required in most U.S. contexts.
Why does my contrast checker say 'pass' for AA but 'fail' for AAA?
AA is the baseline accessibility standard; AAA is the aspirational standard. Most consumer sites target AA. Government, healthcare, education, and financial services often target AAA where feasible.
What counts as 'large text' for the 3:1 ratio?
WCAG defines large text as 18 point or larger, or 14 point bold or larger. Standard 16px body text at normal weight needs the 4.5:1 ratio.
Are accessibility overlays (accessiBe, UserWay) a substitute for proper contrast?
No. Multiple federal court rulings since 2021 have established that overlay widgets do not produce ADA-compliant sites. Overlay vendors do not indemnify their customers against lawsuits. Fix contrast at the design system level.
How do I check my entire site, not just one color pair?
Run Lighthouse Accessibility audit (Chrome DevTools), axe DevTools browser extension, or WAVE (wave.webaim.org). Each will flag every contrast failure across the page. For CI integration, use axe-core or Pa11y.
Does dark mode change anything?
Dark mode requires its own contrast audit — the foreground/background pairs are different from light mode. WCAG criteria apply equally to both modes. Always test both.
Built by Joseph W. Anady at ThatDeveloperGuy. Need professional help? Get a free 48-hour audit.