Check if your text colors are easy to read and meet WCAG rules.
Loading tool...
Learn how to pick good colors and build websites that everyone can use.
A rule that measures if text colors are dark or bright enough to read easily against their background.
The Color Contrast Checker evaluates color combinations against Web Content Accessibility Guidelines (WCAG 2.1) standards. It calculates the relative luminance ratio between foreground text and background colors to ensure readable, accessible digital experiences.
Computes relative luminance ($L$) using the sRGB color space formula defined by the W3C: $L = 0.2126 \times R + 0.7152 \times G + 0.0722 \times B$, where color channels are linear values. The contrast ratio is calculated as $(L_1 + 0.05) / (L_2 + 0.05)$, yielding a score from 1:1 (zero contrast) to 21:1 (maximum contrast, black on white).
Foreground: #2D3748, Background: #FFFFFFContrast Ratio: 9.87:1 — WCAG AA (Pass), WCAG AAA (Pass)Exceeds the 7:1 ratio required for AAA compliance on standard body text, guaranteeing high legibility.
According to WCAG guidelines, a contrast ratio of at least 4.5:1 is required for normal text (AA rating), and 7:1 for strict accessibility (AAA rating).
High color contrast ensures that text is readable for users with visual impairments, color blindness, or those viewing screens in bright sunlight.
Large text is generally defined as text that is 18pt (24px) or larger, or bold text that is 14pt (18.5px) or larger. Large text requires a lower contrast ratio of 3.1:1.