WCAG AAA Contrast Checker
Test whether your color combinations meet the strictest WCAG AAA contrast thresholds. Everything runs client-side for instant, private results.
Color Contrast Checker
Check the contrast ratio between two colors for WCAG 2.1 accessibility compliance. Ensure your text is readable for all users.
Contrast Ratio
14.68:1
Excellent
Live Preview
Large Text (24px bold)
Normal body text at 16px. This is what most of your content will look like. Make sure it's easy to read for all users, including those with visual impairments.
Small text at 14px — captions, footnotes, and secondary content.
WCAG 2.1 Compliance
Presets
About WCAG Color Contrast
The Web Content Accessibility Guidelines (WCAG) define minimum contrast ratios to ensure text is readable by people with moderately low vision or color deficiencies.
AA Normal Text requires a contrast ratio of at least 4.5:1. This applies to body text under 18pt (24px) or under 14pt (18.66px) bold.
AA Large Text requires at least 3:1. Large text is defined as 18pt+ (24px+) or 14pt+ (18.66px+) bold.
AAA is the enhanced level — 7:1 for normal text and 4.5:1 for large text. This is recommended for long-form content and critical UI.
UI Components like icons, borders, and form controls require at least 3:1 contrast against adjacent colors (WCAG 2.1 Success Criterion 1.4.11).
The contrast ratio is calculated using the relative luminance of each color. The formula is: (L1 + 0.05) / (L2 + 0.05), where L1 is the lighter color's luminance.
What is WCAG AAA?
WCAG AAA is the highest conformance level in the Web Content Accessibility Guidelines. It requires a contrast ratio of at least 7:1 for normal text and 4.5:1 for large text. While not always required by law, AAA conformance provides the best readability for users with moderate to severe vision impairments and benefits all users in challenging lighting conditions.
Common use cases
Organizations pursuing best-in-class accessibility target WCAG AAA for critical content such as healthcare portals, financial dashboards, and emergency communications. It is also valuable for e-readers, kiosk interfaces, and any product where maximum readability directly impacts user safety or comprehension.
Frequently Asked Questions
What contrast ratio does WCAG AAA require?
WCAG AAA requires a minimum contrast ratio of 7:1 for normal-sized text and 4.5:1 for large text (18pt or 14pt bold).
Should I aim for WCAG AAA or AA?
Most organizations target AA as the baseline. AAA is ideal for critical-content interfaces like medical or financial apps. Achieving full AAA across an entire site can be difficult, but applying it to body text and key UI elements significantly improves readability.