Tailwind Color Contrast Checker
Check WCAG contrast ratios between Tailwind CSS colors — compatible with Tailwind CSS v3 & v4
- Home
- > Tailwind >
- Color Contrast
Colors
or custom hex:
Preview:
or custom hex:
Preview:
Results
4.72
: 1
AA Normal
✅ PASS
AA Large
✅ PASS
AAA Normal
❌ FAIL
AAA Large
❌ FAIL
Sample Text
The quick brown fox jumps over the lazy dog.
Quick Reference
| Text | Background | Ratio | AA Normal |
|---|