Skip to content
๐ŸŽจ

Color Contrast Checker

Check WCAG accessibility contrast ratios instantly. AA, AAA, and large text standards.

#ffffff ยท rgb(255, 255, 255)
#1a1a2e ยท rgb(26, 26, 46)
The quick brown fox
jumps over the lazy dog. 0123456789
Small text sample โ€” 14px equivalent
Button example
Contrast Ratio
17.06:1
โœฆ AAA
Excellent โ€” meets all standards
Normal text โ€” AAโ‰ฅ 4.5:1 ยท body copy, labels, UI text
โœ“ Pass
Normal text โ€” AAAโ‰ฅ 7:1 ยท enhanced accessibility
โœ“ Pass
Large text โ€” AAโ‰ฅ 3:1 ยท 18px+ bold or 24px+ regular
โœ“ Pass
Large text โ€” AAAโ‰ฅ 4.5:1 ยท enhanced large text
โœ“ Pass

Common Pairs

๐Ÿ’ก WCAG Quick Reference

  • โ€ข AA (4.5:1): minimum for normal text โ€” required by most accessibility laws
  • โ€ข AAA (7:1): enhanced standard โ€” recommended for critical content
  • โ€ข Large text: 18px+ regular or 14px+ bold โ€” lower threshold (3:1 for AA)
  • โ€ข UI components: focus indicators, icons โ€” only need 3:1 regardless of size
  • โ€ข Decorative elements: logos, disabled controls โ€” exempt from contrast requirements

๐Ÿ” Is Your Product Actually Accessible? Let AI Find Out.

Color contrast is just one accessibility check. In 20 minutes I'll audit your full product and show you exactly where accessibility gaps could expose you to compliance risk โ€” and where AI can automate the fixes.

Get Your Free AI Scan โ†’