a11y
Accessibility tools for any web app
Profiles, filters, reading mask — one zero-dependency package for Angular, React, Vue, and plain HTML.
01
Everything in one toolbar
Tap the floating button to try the live widget. Settings persist in localStorage.
- Quick profiles Epilepsy-safe, visually impaired, cognitive, motor, colorblind, dyslexia, ADHD
- Adjust Font size, dyslexia font, highlights, reading mask, motion, spacing
- Visual filters Contrast, monochrome, saturation, deuteranopia
- Bilingual Arabic & English UI, RTL-aware panel
02
Sample content
Enlarge this text, highlight links, pause motion, or enable the reading mask. Headings respond to highlight-titles mode.
Readable experience
The quick brown fox jumps over the lazy dog. الحمد لله رب العالمين — sample Arabic for RTL and dyslexia-friendly checks.
03
Install
npm install @a.nemreen/a11y
Plain HTML / any framework
import { Accessibility } from '@a.nemreen/a11y';
import '@a.nemreen/a11y/styles.css';
Accessibility.mount({ position: 'end' });
Accessibility.createSkipLink({ href: '#main' });
Angular / React / Vue
Mount once at the app root (same API). No framework peer dependencies — the widget is vanilla DOM.
// e.g. main.ts / App.tsx / main.js
Accessibility.mount();