Contrast Checker

Check color contrast for web accessibility (WCAG)

Enter text color in HEX format
Enter background color in HEX format

Sample Heading

This is sample text to show how your colors would look on a website. The contrast between text and background is important for readability.

Sample Link
21.0:1
Contrast Ratio
WCAG 2.1 Compliance
AA (Minimum) - Normal Text (4.5:1)
Pass
AA (Minimum) - Large Text (3:1)
Pass
AAA (Enhanced) - Normal Text (7:1)
Pass
AAA (Enhanced) - Large Text (4.5:1)
Pass
Font Size Examples

12px - Small text (normal text requirement applies)

16px - Regular text (normal text requirement applies)

18px Bold - Large text (large text requirement applies)

24px - Large text (large text requirement applies)

"Large text" is defined as 18pt (24px) or 14pt (18.7px) bold or larger.
Text Color
HEX
#000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
Luminance
0.000
Background Color
HEX
#FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
Luminance
1.000

Accessibility Recommendations

Your colors have excellent contrast

The contrast ratio of 21:1 exceeds all WCAG requirements, making your content highly readable for all users, including those with visual impairments.

Color Suggestions

If your colors don't meet accessibility standards, here are some alternatives with better contrast:

Text on Background
Text: #000000
Background: #FFFFFF
21:1
Text on Background
Text: #FFFFFF
Background: #000000
21:1