Free WCAG Color Contrast Checker
WCAG 2.1 · AA & AAA · Instant
Foreground
Background
Normal — The quick brown fox jumps over the lazy dog.
Large — Pack my box with five dozen liquor jugs.
Normal text ≥ 4.5:1
Large text ≥ 3:1
Normal text ≥ 7:1
Large text ≥ 4.5:1
What is WCAG color contrast ratio?
The WCAG color contrast ratio measures the difference in relative luminance between two colors. It ranges from 1:1 (no contrast, same color) to 21:1 (maximum contrast, black on white). This contrast ratio calculator uses the exact formula defined in WCAG 2.1.
What is the difference between AA and AAA compliance?
AA is the standard accessibility compliance level required by most laws, regulations, and design systems. It requires a contrast ratio of 4.5:1 for normal text and 3:1 for large text. AAA is the enhanced level — 7:1 for normal text and 4.5:1 for large text — and is recommended for audiences with severe visual impairment.
What counts as large text?
WCAG defines large text as 18pt (24px) or larger, or 14pt (approximately 18.67px) bold or larger. Large text has a lower contrast requirement because it's inherently easier to read at lower contrast levels due to its size.
Who needs to meet WCAG contrast requirements?
Any website or app targeting public audiences should meet at least WCAG 2.1 AA. It's legally required under ADA (USA), EN 301 549 (EU), and similar frameworks in many countries. Designers, developers, and accessibility auditors use contrast checkers like this to verify compliance before shipping.
Is my data private?
Yes. All contrast calculations run entirely in your browser — no color data is sent to any server.