Claude Code Skill Front A11y
Audit and fix accessibility issues against WCAG 2.1 AA, directly from Claude Code.
Claude Code Skill Front A11y is a Claude Code skill that analyses frontend files for accessibility violations across images, forms, interactive elements, ARIA usage, keyboard navigation, and semantic structure. Using a single slash command, audit mode produces a structured report grouped by severity, fix mode applies all automatically-fixable issues directly to the file and lists what requires manual attention. Compatible with HTML, React, Vue, Svelte, and Astro, it covers the most widely used frontend templating languages.
Skill for Claude Code
See the CHANGELOG
Demo of Claude Code Skill Front A11y
Key Features of Claude Code Skill Front A11y
- ♿ WCAG 2.1 AA compliance: all checks are mapped to official success criteria
- 🔍 Two modes: Audit (structured report, file untouched) or Fix (auto-applies all fixable issues)
- 🌐 Supports 5 file types: HTML, React (JSX/TSX), Vue, Svelte, Astro
- 🚦 Three severity levels: 🔴 Critical (blocks assistive tech), 🟠 Major (degrades experience), 🟡 Minor (best practice)
- 📋 7 audit categories: Images, Links & Buttons, Forms, ARIA & Roles, Keyboard & Focus, Semantic HTML, Color & Contrast
- 🛠️ Smart auto-fix: applies safe corrections automatically and lists what requires manual attention in a Fix Report
- 🧩 Framework-aware: handles JSX syntax, Vue/Svelte dynamic bindings, Next.js
Image, Astroslot, and more - ⚡ Optimized loading: sub-files per language, only the relevant rules are loaded per run
Part of the Claude Code Frontend Skills collection.
