A11y component
Skill badass-courses/a11y-agent/.claude/skills/a11y-component
Accessibility expertise for AI coding agents.
npx -y skills add badass-courses/a11y-agent --skill a11y-componentAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
2 things to look at
- no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
- 0 stars0 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Scaffold accessible interactive components with correct ARIA, keyboard handling, and focus management. Supports modal, menu, tabs, accordion (v1), plus date picker, combobox, slideshow (v2). Use when building these from scratch.
SKILL.md
1.6 KB, as published. Nobody here has run it
Scaffold an accessible {{pattern}} component.
→ Consult the a11y-agent skill for foundational accessibility patterns.
Process
- Confirm which pattern the user wants
- Ask: What framework? (React, Vue, vanilla JS, other)
- Read the matching template from reference/
- Ask context questions:
- What triggers this component? (button, link, route change)
- Does it need animation? (will add prefers-reduced-motion support)
- Existing design system tokens/classes to use?
- Adapt template to user's framework and design system
- Include keyboard handling, ARIA states, focus management
- Generate matching test file using a11y-test patterns
Available Patterns
| Pattern | Template | Keyboard | Focus Management |
|---|---|---|---|
| Modal/Dialog | reference/modal.md | Escape to close, Tab trap | Into dialog on open, back to trigger on close |
| Menu/Dropdown | reference/menu-dropdown.md | Arrows between items, Escape | First item on open, trigger on close |
| Tabs | reference/tabs.md | Arrows between tabs | Roving tabindex within tab list |
| Accordion | reference/accordion.md | Enter/Space toggle | Stays on trigger |
Each template includes: HTML structure, ARIA attributes, keyboard spec, focus rules, gotchas.