Accessibility Auditor
CautionAudits web pages and components for WCAG 2.1/2.2 compliance, identifies accessibility violations, and generates fix recommendations with code examples.
Install
Claude Code
Copy the SKILL.md file to your project's .claude/skills/ directory About This Skill
Accessibility Auditor performs comprehensive WCAG 2.1 and 2.2 compliance checks on web pages, components, and entire codebases. It identifies violations across all four WCAG principles — Perceivable, Operable, Understandable, and Robust — and provides actionable fix recommendations with code examples.
How It Works
- Markup analysis — Scans HTML for missing alt text, improper heading hierarchy, missing form labels, and landmark region issues
- ARIA validation — Checks ARIA roles, states, and properties against WAI-ARIA spec requirements
- Color contrast — Evaluates text/background color pairs against WCAG AA and AAA contrast thresholds
- Keyboard audit — Analyzes tab order, focus indicators, and keyboard trap risks
- Report generation — Produces a prioritized violation report with severity levels (Critical, Serious, Moderate, Minor)
Best For
- Teams preparing for accessibility compliance deadlines (ADA, EAA)
- Reviewing pull requests for accessibility regressions
- Auditing third-party component libraries before adoption
- Training developers on common accessibility patterns
Standards Coverage
Covers WCAG 2.1 Level A and AA criteria fully, with partial AAA coverage. Includes checks from WCAG 2.2 additions including focus appearance, dragging movements, and consistent help patterns.
Use Cases
- Pre-launch accessibility compliance audits
- Reviewing component libraries for ARIA pattern correctness
- Generating remediation reports for stakeholders
- Keyboard navigation and focus management analysis
Pros & Cons
Pros
- + Comprehensive WCAG 2.1/2.2 coverage
- + Prioritized violations with severity levels
- + Provides fix code examples, not just problem descriptions
- + Covers both automated checks and manual review guidance
Cons
- - Cannot test dynamic interactions — screen reader testing still needed
- - Color contrast checks require computed style values, not just source CSS
Related Skills
Color Palette Generator
VerifiedGenerates harmonious color schemes with WCAG accessibility checks, contrast ratio validation, and export to CSS custom properties or design tokens.
Responsive Layout
CautionImplements responsive design patterns using CSS Grid, Flexbox, and container queries with mobile-first breakpoint strategies.
Stay Updated on Agent Skills
Get weekly curated skills + safety alerts
每周精选 Skills + 安全预警