WCAG Color Contrast Checker
Test color pairs for WCAG 2.1 AA and AAA accessibility compliance. Instant contrast ratio and pass/fail results.
Foreground (Text)
Relative luminance
Background
Relative luminance
Presets
Large Text (18pt / 14pt bold)
Normal text — The quick brown fox jumps over the lazy dog
UI Component
—
WCAG 2.1 Results
Suggested Adjustments
Darkened/lightened foreground variants that pass AA for normal text:
Advertisement
Frequently Asked Questions
The Web Content Accessibility Guidelines (WCAG) are published by the W3C. They define how to make web content more accessible to people with disabilities. WCAG 2.1 Level AA is the most widely adopted accessibility standard, required by law in many countries including the EU, UK, US (ADA), and Australia.
WCAG 2.1 requires: AA Normal text — 4.5:1. AA Large text (18pt or 14pt bold) — 3:1. AAA Normal text — 7:1. AAA Large text — 4.5:1. Non-text UI components (borders, icons, form controls) require 3:1 for AA. The highest ratio possible is 21:1 (black on white).
WCAG uses relative luminance, which accounts for how the human eye perceives brightness differently across the color spectrum. Luminance is calculated by converting sRGB values to linear space and applying the formula: L = 0.2126R + 0.7152G + 0.0722B. The contrast ratio is then (L1 + 0.05) / (L2 + 0.05), where L1 is the lighter color.