Media & Design
Color Contrast Checker
Check the WCAG contrast ratio of two colours for normal and large text.
Results appear here.
What the result means
Contrast is a ratio of relative luminance, not a guess about how colors look to you. Each sRGB channel is divided by 255. If that value is at most 0.04045 it is divided by 12.92. Otherwise 0.055 is added, the sum is divided by 1.055, and the result is raised to the power 2.4. Luminance is 0.2126 times red, plus 0.7152 times green, plus 0.0722 times blue. The ratio is the lighter luminance plus 0.05, divided by the darker luminance plus 0.05, and the page rounds that ratio to two decimals. WCAG AA asks for 4.5 for normal text and 3 for large text. AAA asks for 7 and 4.5. The sample sentence is drawn in the two colors you picked. Color blindness is not tested.
Related tools
Questions
What is WCAG AA?
WCAG AA is a contrast target from the Web Content Accessibility Guidelines. Normal text needs a ratio of at least 4.5 to 1. Large text, about 18 point or 14 point bold, can pass AA at 3 to 1. AAA is stricter: 7 for normal text and 4.5 for large text.
Does this check colour blindness?
No. It does not check colour blindness. The ratio only compares light and dark. Two colors can pass and still be hard to tell apart for some viewers.
Does rounding change a pass?
The ratio is rounded to two decimals, and pass or fail uses that rounded figure. A value that is only a few thousandths under a cutoff can display as the cutoff and pass. The sample sentence is not scored.