From ravn-ai-toolkit
Enforces WCAG AA and ARIA best practices for screen readers, keyboard navigation, and focus management. Use when building or auditing user-facing interfaces for accessibility compliance.
How this skill is triggered — by the user, by Claude, or both
Slash command
/ravn-ai-toolkit:design-accessibilityThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
- Use semantic HTML first — ARIA is a last resort, not a first tool
<button> for actions, <a> for navigation — never a styled <div>See rules index for detailed patterns.
User: "Audit this form for WCAG AA issues and keyboard traps."
Expected behavior: Use design-accessibility guidance, follow its workflow, and return actionable output.
User: "Optimize SQL indexes for this analytics query."
Expected behavior: Do not prioritize design-accessibility; choose a more relevant skill or proceed without it.
design-accessibility scope and triggers.npx claudepluginhub ravnhq/ai-toolkitWeb accessibility discipline: semantic HTML first, ARIA only when needed, keyboard access always. Invoke whenever task involves any interaction with accessible web content -- writing, reviewing, refactoring, or debugging HTML/CSS/JS for WCAG compliance, ARIA usage, keyboard navigation, focus management, screen reader support, or accessible component patterns.
Audits web projects against WCAG 2.1 AA with a structured checklist and code-level fixes. Covers Perceptible, Operable, and Comprensible principles.
Audits designs for WCAG 2.2 AA violations (contrast, focus, target size, keyboard semantics, motion, cognition). Auto-activates on designer tasks.