40+ Awesome CSS Accessibility Effects Collection (Projects and Codes) in 2025

Accessible Modal Dialog Component In Vanilla JavaScript

a11y-dialog-component

Vanilla JS Accessible Dialog Library

Apply A CSS Class To Element When It Gets Focus

keyboardFocus.js

A lightweight library that applies a class to an element only when it is focused by tabbing.

accessibility-plugin

The Accessibility Plugin is a JavaScript library that helps improve the accessibility of your web applications. It provides a set of utility functions and components that can be easily integrated into your project.

Neumorphism Accessibility Example

An example of how we can develop neumorphic buttons in a more accessible way. There are outlines which are above WCAG 2.1 AA contrast guidelines, and the icon changes colour to indicate when it's in a different state.

microtip

Minimal, accessible, ultra lightweight css tooltip library. Just 1kb.

input-masking

Framework agnostic accessible input masking library

accessible-image-lazy-load

gandul! accessible lazy loading images

hidden

Hidden.js is a pure JavaScript accessibility testing tool that automatically hides HTML elements that have accessibility issues based on the ax-core library.

houdini

A simple, accessible show-and-hide/accordion script.

aria_toggle_blocks

ARIA Toggle Blocks is an accessible, progressively enhanced content toggle library to show and hide content sections with toggle buttons.

aria-accordion

AriaAccordion is a vanilla JavaScript plugin to generate a fully accessible accordion widget on the webpage.

superplaceholder.js

superplaceholder.js is a JavaScript library for animated placeholders that allow you to rotate through an array of placeholder text with a typing effect inside the input field.

accessible-modal-dialog

A very lightweight and flexible accessible modal dialog script.

JSPanel

A library that helps you write a static dropdown menu that follows the digital accessibility recommendations.

accessible-autocomplete

A flexible, accessible, touch-enabled, progressive enhancement autocomplete library written in Vanilla JavaScript.

dom-slider

dom-slider is a pure JavaScript slide animation library for animated slideUp and slideDown of elements within the document.

accessibility-web-page

Simple plugin for help add accessibility in your Web Page. You will find this plugin in npmjs.com.

kineto

Smart and versatile JavaScript carousel plugin.

split-view

An accessible image comparison web component

lintHTMLwithCSS.css

lint html with css is a collection of css snippets from the hashtag #linthtmlwithcss on twitter. these css snippets intend to warn developers about common mistakes made in html.

Overlay

A simple responsive modal system for the web. Fully accessible. Easy to style. No dependencies. Works down to IE8.

a11y-accordion-tabs

A script for an accessible accordion tabs component

van11y-accessible-accordion-aria

This is the Vanilla JavaScript version of the jQuery Accessible Accordion Aria plugin to implement a configurable, WAI-ARIA compliant accordion component in plain JavaScript.