Grayscale Accessibilty Test

• 1 min read

It’s important that color is not used as the only visual means of conveying information.

Add this class to your CSS to switch to grayscale mode and check if your user interface is still comprehensible and visual elements distinguishable.

.a11y-grayscale {
  filter: grayscale(100%) !important;
}
<html class="a11y-gray" lang="en" />
...
</html>