chrisphan.com

Color contrast checker

An analog clock reading 11:052023-07-15 / 2023-W28-6T11:05:00-05:00 / 0x64b2c3ac

Categories: programming, design, accessibility

Screenshot: A widget in which the user can enter as hex triplets (or using the system color-picker) two colors. The widget then shows the relative luminance of each color as well as the contrast ratio and the WCAG 2.0 accessibility ratings for that contrast ratio

I made this color contrast checker. You can specify colors either by entering hex triplets (e.g. #00ffdd) or using your browser's built-in color-selecting widget. It will compute the contrast ratio and determine if the color contrast meets the WCAG 2.1 accessibility success criterion 1.4.3 (AA) or 1.4.6 (AAA).