Test color combinations for WCAG 2.1 AA/AAA accessibility compliance. Calculate contrast ratios instantly. Perfect for designers and developers ensuring text readability. Pure client-side.
Normal text sample (16px)
Large text sample (18pt bold)
The Web Content Accessibility Guidelines (WCAG) define contrast ratio requirements to ensure text is readable for people with visual impairments. This tool calculates the contrast ratio between two colors and evaluates compliance with WCAG 2.1 Level AA and AAA standards. All calculations run in your browser — no data is sent to any server.
The WCAG contrast ratio measures the difference in luminance between foreground (text) and background colors. It is calculated as (L1 + 0.05) / (L2 + 0.05), where L1 is the relative luminance of the lighter color and L2 is the relative luminance of the darker color. A ratio of 4.5:1 is required for AA compliance with normal text.
WCAG Level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. Level AAA is stricter, requiring 7:1 for normal text and 4.5:1 for large text. Most organizations aim for AA compliance, while AAA is recommended for enhanced accessibility.
Large text is defined as 18 points (24 pixels) or larger, or 14 points (18.67 pixels) or larger if bold. Large text has lower contrast requirements because larger text is naturally easier to read.
Color contrast compliance is legally required in many jurisdictions (ADA in the US, EAA in Europe). It also improves readability for all users, especially those with low vision, color blindness, or viewing screens in bright sunlight. Good contrast benefits everyone.