accessibility — Skills — getagentictools

What it does

A copy-paste or autofill mechanism is available

An alternative method exists (e.g., passkey, SSO, email link)

The test uses object recognition or personal content (AA only; AAA removes this exception)

[ ] Keyboard navigation: Tab through entire page, use Enter/Space to activate

[ ] Screen reader: Test with VoiceOver (Mac), NVDA (Windows), or TalkBack (Android)

[ ] Zoom: Content usable at 200% zoom

[ ] High contrast: Test with Windows High Contrast Mode

Requirements & configuration

Images require alt text:

Icon buttons need accessible names:

/ ✅ Focus states need contrast too (3:1 against background, WCAG 1.4.11) /

Any action that requires dragging must have a single-pointer alternative (e.g., buttons, inputs). See the dragging movements pattern for a sortable-list example.

Every input needs a programmatically associated label. See the form labels pattern for explicit, implicit, and instructional examples.

Source

Repository: https://github.com/addyosmani/web-quality-skills

accessibility FAQ

What does the accessibility skill do?

Audit and improve web accessibility following WCAG 2.2 guidelines. Use when asked to "improve accessibility", "a11y audit", "WCAG compliance", "screen reader support", "keyboard navigation", or "make accessible". A copy-paste or autofill mechanism is available An alternative method exists (e.g., passkey, SSO, email link)

What does accessibility require?

Images require alt text: Icon buttons need accessible names: / ✅ Focus states need contrast too (3:1 against background, WCAG 1.4.11) / Any action that requires dragging must have a single-pointer alternative (e.g., buttons, inputs). See the dragging movements pattern for a sortable-list example. Every input needs a programmatically associated label. See the form labels pattern for explicit, implicit, and instructional examples.

How do I install accessibility?

Run: npx -y skills add https://github.com/addyosmani/web-quality-skills --skill accessibility --agent claude-code — the source lives at github.com/addyosmani/web-quality-skills.

Maintain accessibility?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

[![accessibility on getagentictools](https://getagentictools.com/badge/skills/addyosmani-web-quality-skills-accessibility.svg)](https://getagentictools.com/skills/addyosmani-web-quality-skills-accessibility?ref=badge)

npx agentictools info skills/addyosmani-web-quality-skills-accessibility

The second line is the CLI lookup for this page — handy in READMEs and docs.