Colour-Contrast-Checker icon indicating copy to clipboard operation
Colour-Contrast-Checker copied to clipboard

Published 20 hours ago • verified publisher icon Pushedskydiver

Tool itself can have insufficient contrast

Open missmatsuko opened this issue 4 years ago • 1 comments

Since the background color changes based on the colors being compared, the tool itself can fail WCAG contrast requirements.

When I compared #C4C4C4 and #FFFFFF, the page heading ("colour contrast checker) and HSL sliders fail contrast requirements: Screenshot of #C4C4C4 and #FFFFFF comparison in the browser extension.

In this example, the background colour is #C4C4C4 (contrast of 1.74 to background), the heading color is #FFFFFF, and the slider bars are #939393 (contrast of 1.76 to background).

I would recommend not changing the whole tool's background colour, and having a preview swatch instead.

missmatsuko avatar Jan 01 '21 18:01 missmatsuko

Second this. This is a great tool but I can't read the copy when the accessibility is poor.

bryanjonker-illinois avatar Apr 07 '23 14:04 bryanjonker-illinois