Page Accessibility Testing In Pure CSS – a11y-tests.css

Category: CSS & CSS3 | October 30, 2019
0 Comment
Demo Download
Author:matuzo
Views Total:284 views
Official Page:Go to website
Last Update:October 30, 2019
License:MIT

Preview:

Page Accessibility Testing In Pure CSS – a11y-tests.css

Description:

a11y-tests.css is a pure CSS library to test the page accessibility by toggling color, blur, animation, large text, no mouse classes on the <html> element.

How to use it:

1. Download and import the a11y-tests.css into the webpage.

<link rel="stylesheet" href="a11y-tests.css" />

2. Toggle the following CSS classes to test the accessibility on the webpage.

  • .a11y-tests-grayscale: text color
  • .a11y-tests-blur: blur effect
  • .a11y-tests-no-mouse: no cursor
  • .a11y-tests-large-text: large text
  • .a11y-tests-no-animation: no animation
<html class="class here">
  ...
</html>

See Also:

You Might Be Interested In:

Leave a Reply