WCAG Color Contrast Checker
Check color contrast against WCAG 2.1. Verify AA and AAA accessibility compliance instantly.
Sample Text
This is a normal text paragraph to verify readability.
#1a1a1f
#f8f6f3
Why use it
Web accessibility without guessing contrast ratios
Official WCAG 2.1
Uses the exact W3C relative luminance formula. Precise, compliant results.
AA and AAA at a glance
Instantly see if your combination meets the minimum legally required level.
Instant
Real-time calculation as you change colors.
No signup
Check your colors without accounts or installs.
How it works
Three steps, no hassle
Enter your colors
Select text color and background color using the color picker or by entering hex, RGB, or HSL values directly.
Get the contrast ratio
The contrast ratio is calculated instantly using the WCAG 2.1 relative luminance formula. See if it meets AA and AAA levels.
Adjust until compliant
If the contrast doesn't meet requirements, adjust the colors. The checker tells you which conformance level your color combination achieves.
FAQ
Got questions?
WCAG (Web Content Accessibility Guidelines) are the web content accessibility guidelines developed by the W3C (World Wide Web Consortium). They are the international reference standard for making web content accessible to people with visual, auditory, motor, and cognitive disabilities. The current version is WCAG 2.1 (published June 2018); WCAG 2.2 was published in October 2023 with additional success criteria. WCAG 3.0 is in development and proposes a new contrast model based on APCA (Advanced Perceptual Contrast Algorithm).
WCAG defines three conformance levels. Level A: basic requirements that, if unmet, make content inaccessible. Level AA: the recommended standard for most websites; required by law in many countries. Level AAA: the highest accessibility level, not always achievable for all content. For color contrast: AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 for normal text and 4.5:1 for large text. Web accessibility legislation (ADA in the US, EAA in Europe) generally requires level AA.
The contrast ratio is a number between 1:1 (no contrast, identical colors) and 21:1 (maximum contrast, black on white). It is calculated as (L1 + 0.05) / (L2 + 0.05), where L1 is the relative luminance of the lighter color and L2 that of the darker. The relative luminance of an sRGB color is calculated by transforming each channel (R, G, B) from gamma to linear: if the normalized value is ≤ 0.03928 use channel/12.92, otherwise use ((channel+0.055)/1.055)^2.4. The final luminance is 0.2126×R + 0.7152×G + 0.0722×B.
In the United States, the Americans with Disabilities Act (ADA) applies to websites of covered entities and courts have established WCAG 2.1 level AA as the applicable standard. In Europe, the European Accessibility Act (Directive 2019/882) came into force on June 28, 2025, requiring digital products and services to meet accessibility standards equivalent to WCAG 2.1 AA. Ignoring these requirements can result in litigation and fines.
WCAG 2.1 defines large text as text at least 18 points (approximately 24px) at normal weight, or at least 14 points (approximately 18.67px) in bold (font-weight 700 or higher). This text has a lower contrast requirement (3:1 for AA instead of 4.5:1) because the larger size aids readability even with lower contrast. Logos and purely decorative text are exempt from contrast requirements. UI components (buttons, inputs) require a minimum 3:1 for their active parts (criterion 1.4.11 Non-text Contrast).
WCAG color contrast: web accessibility, legislation, and algorithms
The Web Content Accessibility Guidelines (WCAG) originated in the W3C's Web Accessibility Initiative (WAI), launched in 1997. WCAG 1.0 was published in May 1999. WCAG 2.0 arrived in December 2008, introducing the four-principle model: Perceivable, Operable, Understandable, and Robust (POUR). WCAG 2.1 (June 2018) added 17 new success criteria, especially for mobile users, people with low vision, and users with cognitive disabilities. Criterion 1.4.3 (Minimum Contrast) establishes the contrast ratio requirements that make this tool necessary. Section 508 of the US Rehabilitation Act (updated in 2017) incorporates by reference WCAG 2.0 level AA for federal information technology.
The WCAG relative luminance formula is based on the sRGB color space (IEC 61966-2-1), the standard for computer monitors since 1999. The sRGB gamma-to-linear transformation (the ((c+0.055)/1.055)^2.4 operation for values above 0.03928) approximates the actual gamma curve of the sRGB standard. The luminosity coefficients (0.2126 for red, 0.7152 for green, 0.0722 for blue) reflect the human eye's sensitivity to each wavelength, based on the work of the International Commission on Illumination (CIE). Lea Verou, MIT researcher and W3C CSS Working Group member, developed a widely cited reference implementation and created the tool contrast-ratio.com in 2012.
WCAG 3.0 (currently in draft) proposes replacing the current contrast formula with APCA (Advanced Perceptual Contrast Algorithm), developed by Andrew Somers. APCA better models human visual perception by accounting for contrast polarity (dark text on light background vs. light text on dark background are perceived differently), font size and weight, and visual system adaptation. The APCA scale runs from 0 to 106 Lc (Lightness Contrast), and its thresholds differ significantly from WCAG 2.x ratios — for example, black text on pure white gives 106 Lc, while combinations that would pass AA in WCAG 2.x might fail in APCA or vice versa. The transition to WCAG 3.0 will be gradual and the final version is not expected before 2026.