Claude Skill MartBrowse skillsWhat is a Skill?
 
← Back to list

a11y-audit

A three-phase Scan/Fix/Verify skill that finds WCAG 2.2 A and AA violations and writes framework-specific fixes for React, Vue, Angular, Svelte, Next.js and plain HTML.

Dev & CodingIntermediate★ 24,151⑂ 3,405AI score 9/10Last updated: Aug 9, 2026

What it does

A complete accessibility audit pipeline built around Scan → Fix → Verify.

  • Walks your codebase for every WCAG 2.2 Level A and AA violation, classified as Critical / Major / Minor with suggested SLAs
  • Auto-detects your framework and emits before/after code diffs tailored to it
  • contrast_checker.py validates foreground/background pairs against AA and AAA ratios and suggests accessible alternatives (including Tailwind class scanning)
  • Audits keyboard navigation, focus management, tab order and ARIA misuse
  • Produces stakeholder-ready compliance reports
  • Ships CI configs for GitHub Actions, GitLab CI, Azure DevOps and pre-commit hooks

Who it's for

  • Frontend engineers on public-sector, fintech or edtech products where WCAG conformance is a legal requirement
  • Design-system maintainers verifying that a color palette clears contrast thresholds
  • Tech leads adding an accessibility gate to code review or CI
  • QA and PMs who must report compliance status to stakeholders

Examples

  1. Pre-release sweep — run /a11y-audit --scope src/ --report to get a ranked violation list plus a stakeholder report in one pass.
  2. Component remediation — paste a product card built from <div onClick>; the skill flags the missing alt, the non-keyboard-accessible handler and two failing contrast pairs, then returns an <a> version with aria-label and AA-safe colors.
  3. CI regression guard — store a baseline JSON, then run --ci on every pull request so the build fails when a new Critical issue appears.

· · · Install guide · · ·

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on Claude Skill Mart.
Copy the .gemini/skills/a11y-audit folder from the GitHub repo alirezarezvani/claude-skills into my ~/.claude/skills/a11y-audit/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone https://github.com/alirezarezvani/claude-skills.git /tmp/claude-skills && mkdir -p ~/.claude/skills && cp -r /tmp/claude-skills/.gemini/skills/a11y-audit ~/.claude/skills/

⚠ This is a third-party skill. Check the source repository before installing.

  1. Open a terminal and clone the repository: 
    git clone https://github.com/alirezarezvani/claude-skills.git
  2. Make sure the Claude Code skills directory exists: 
    mkdir -p ~/.claude/skills
  3. Copy just this skill into place: 
    cp -r claude-skills/.gemini/skills/a11y-audit ~/.claude/skills/
  4. Verify with ls ~/.claude/skills/a11y-audit — you should see SKILL.md, scripts/ and references/.
  5. The scanner scripts need Python 3; check with python3 --version.
  6. Restart Claude Code, open your project folder, and type /a11y-audit or simply ask "audit this project for accessibility issues".
View source on GitHub ↗License: MIT