WCAG Compliance Check
Enter a foreground and background color to calculate the contrast ratio. The checker shows whether your combination passes WCAG AA and AAA standards for normal and large text.
Color Contrast Checker
Check the contrast ratio between two colors for accessibility compliance. Verify WCAG AA and AAA standards for text and background color combinations.
color contrast checkercontrast checkeraccessibility contrast checkerwcag contrast checkercolor accessibility toolcontrast ratio checker
Browser basedNo signupCopy-ready output
Enter foreground and background colors
Output
Generated output will appear here.
Real-Time Feedback
See a live preview of your color combination with sample text. The tool updates the contrast ratio and pass/fail status as you adjust colors.
Accessibility Made Easy
Building accessible websites is critical. This tool helps you verify color choices meet the 4.5:1 ratio for normal text and 3:1 for large text required by WCAG guidelines.
Frequently Asked Questions
What contrast ratio is required for WCAG compliance?
WCAG AA requires a 4.5:1 contrast ratio for normal text and 3:1 for large text (18pt or 14pt bold). WCAG AAA requires 7:1 for normal text and 4.5:1 for large text.
What color formats can I use?
You can enter colors as hex codes (#FF5733), RGB values (rgb(255, 87, 51)), or color names (red, blue). The checker accepts most standard CSS color formats.