Color Contrast Checker

Specify text, link, and background colors to determine if they provide adequate contrast "when viewed by someone having color deficits or when viewed on a black and white screen"[W3C].

This tool indicates that the colors PASS the test if both the color difference and the brightness difference exceed their threshold. It will indicate that it SORT OF passes if only one of the two values exceed their threshold. It will FAIL to pass if neither value exceeds the threshold.

The tool will indicate if the colors pass the WCAG 2.0 contrast ratio formula. The WCAG 2.0 formula differentiates between text smaller than 18pt text larger than 18pt (or text that is bold and larger than 14pt). For WCAG 2.0 1.4.3 AA compliance, text should have a ratio of at least 4.5:1 (larger text, at least 3:1). For WCAG 2.0 1.4.6 AAA compliance, text should have a ratio of at least 7:1 (larger text, at least 4.5:1). For WCAG 2.0 1.4.1 A compliance, links and surrounding text should have a ratio of at least 3:1 or use another visual indicator for the link like an underline.

Hint: 3 character hex values are accepted with or without the hash.

Text to Background Contrast Analysis

Brightness Difference
>= 125

Color Difference
>= 500

Are colors Compliant?

Contrast Ratio

WCAG 2.0 1.4.3 AA

WCAG 2.0 1.4.3 AA (18pt+)

WCAG 2.0 1.4.6 AAA

WCAG 2.0 1.4.6 AAA (18pt+)

More Color Contrast Tools