Color Contrast Checker
Check if your color combinations meet WCAG accessibility guidelines
Colors
Common Colors
Left click to select background color, right click for text color
Preview
Results
About WCAG Accessibility
The Web Content Accessibility Guidelines (WCAG) establish standards for making web content accessible to people with disabilities.
For text and UI components, WCAG defines contrast ratio requirements:
- Normal text (<18pt): AA requires 4.5:1 ratio, AAA requires 7:1
- Large text (≥18pt/14pt bold): AA requires 3:1 ratio, AAA requires 4.5:1
- UI components and graphics: AA requires 3:1 ratio
Color Contrast Checker - WCAG Compliance Tool
Ensure your website meets accessibility standards with our free color contrast checker tool.
Check if your text and background color combinations provide sufficient contrast for readability according to WCAG guidelines.
Get instant feedback on contrast ratios and compliance with different WCAG levels (AA, AAA).
Perfect for designers, developers, and content creators who want to create accessible digital content.
Improve your website's usability for all users, including those with visual impairments.
WCAG 2.1 Contrast Standards:
- Level AA (minimum): 4.5:1 for normal text, 3:1 for large text
- Level AAA (enhanced): 7:1 for normal text, 4.5:1 for large text
- Large text is defined as 14pt (18.66px) and bold or larger, or 18pt (24px) and larger
- Non-text elements (like icons) should have a contrast ratio of at least 3:1
Benefits of Good Color Contrast:
Improved readability for all users, better user experience in various lighting conditions, compliance with accessibility laws and standards, and reaching a wider audience including users with visual impairments.