Check Color Contrast for WCAG Accessibility Online
Verify your color combinations meet WCAG accessibility guidelines. Enter any two colors and instantly see the contrast ratio with AA/AAA pass/fail results for text and UI components.
Color Contrast Checker
Check WCAG color contrast ratios for accessibility compliance
Contrast Ratio
14.63:1
Excellent
5 of 5 WCAG criteria passed
Heading Text (28px Bold)
Large text - 20px semi-bold. This meets the WCAG "large text" definition and only needs 3:1 contrast.
Normal body text at 16px. This is the most common text size and requires 4.5:1 contrast for WCAG AA compliance. Make sure your content is readable at this size.
Small text at 13px - captions, footnotes, and fine print. Harder to read, so good contrast matters even more here.
WCAG 2.1 Compliance
AA Normal Text
Pass - requires 4.5:1
Body text under 18pt (or under 14pt bold)
AA Large Text
Pass - requires 3:1
Text 18pt+ or 14pt+ bold
AAA Normal Text
Pass - requires 7:1
Enhanced contrast for body text
AAA Large Text
Pass - requires 4.5:1
Enhanced contrast for large text
AA UI Components
Pass - requires 3:1
Icons, borders, form controls
Quick Reference
Quick Start
- 1Enter a foreground (text) color in hex format
- 2Enter a background color
- 3View the contrast ratio and WCAG compliance results
- 4Adjust colors until you achieve the desired accessibility level
More Check Tools
All checkers →Test Regular Expressions Online
Test and debug regex patterns with real-time matching and group highlighting. Free online regex tester with explanation.
Compare Text & Find Differences Online
Compare two blocks of text and see additions, deletions, and changes highlighted. Free online diff checker.
Check Website SEO Online
Analyze your page for SEO issues including meta tags, headings, and content quality. Free online SEO checker.
Check & Explain Cron Expressions Online
Validate cron expressions and see when they'll run next. Free online cron expression checker with human-readable explanations.
Check Open Graph Tags & Preview Social Cards Online
Preview how your page appears when shared on Facebook, Twitter, and LinkedIn. Free online OG tag checker.
Check Text Similarity Online
Compare two texts and calculate the similarity percentage. Free online text similarity checker with diff highlighting.
Looking for FAQs and advanced options? Visit the full Color Contrast Checker page →