Agent skill · design visual · yonatangross

accessibility

Accessibility patterns for WCAG 2.2 compliance, keyboard focus management, React Aria component patterns, cognitive inclusion, native HTML-first philosophy, and user preference honoring. Use when implementing screen reader support, keyboard navigation, ARIA patterns, focus traps, accessible component libraries, reduced motion, or cognitive accessibility.

Why this skill is useful

Provides specific patterns and rules for WCAG 2.2 compliance and accessible component implementation that the AI wouldn't reliably generate on its own.

What it needs

About 4k tokens when loaded. Last updated 2026-08-06. 215 stars on the source repository.

What this skill does

Accessibility Comprehensive patterns for building accessible web applications: WCAG 2.2 AA compliance, keyboard focus management, React Aria component patterns, native HTML-first philosophy, cognitive inclusion, and user preference honoring. Each category has individual rule files in rules/ loaded on-demand. Quick Reference Category Rules Impact When to Use ---------- ------- -------- ------------- WCAG Compliance 3 CRITICAL Color contrast, semantic HTML, automated testing POUR Exit Criteria 1 CRITICAL Falsifiable pass/fail thresholds for each WCAG 2.2 AA criterion Static Anti-Patterns 1 HIGH Grep-able patterns detectable without a browser Focus Management 1 HIGH Keyboard navigation; trap/restoration mechanics live upstream React Aria 2 HIGH Accessible components and form hooks; overlay APIs live upstream Modern Web Accessibility 2 CRITICAL/HIGH Native HTML first, user preferences; cognitive ceilings in references/ork-delta.md Total: 10 rules across 6 categories Quick Start WCAG Compliance WCAG 2.2 AA implementation for inclusive, legally compliant web applications. Rule File Key Pattern ------ ------ ------------- Color Contrast rules/wcag-color-contrast.md 4.5:1 text, 3:1 UI components, focus indicators Semantic HTML rules/wcag-semantic-html.md Landmarks, headings, ARIA labels, form structure Testing rules/wcag-testing.md axe-core, Playwright a11y, screen reader testing POUR Exit Criteria Concrete pass/fail thresholds for each WCAG 2.2 AA criterion — replaces vague "meets requirements" checks. Rule File Key Pattern ------ ------ ------------- POUR Exit Criteria rules/pour-exit-criteria.md Falsifiable checklist: image alt, contrast ratios, focus indicators, touch targets, ARIA states Static Anti-Patterns Grep-able anti-patterns detectable via static analysis or code review — no browser needed. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills yonatangross/accessibility

View the source on GitHub

Browse the @skills marketplace