Claude Skill MartBrowse skillsQuick linesLearn by videoTerminal guideWhat is a Skill?
← Back to list

Accessibility Audit (WCAG 2.2)

Turns any UI or design into a structured WCAG 2.2 audit with pass/fail checks and a prioritised remediation plan.

Design & UIIntermediate★ 1,435⑂ 255AI score 9/10Last updated: Oct 10, 2026

What it does

  • Builds a checklist across the four WCAG 2.2 principles (Perceivable, Operable, Understandable, Robust).
  • Classifies findings as 🔴 Critical / 🟡 Moderate / 🟢 Minor, each mapped to a WCAG criterion with a concrete fix and effort estimate.
  • Separates "Quick Wins" that ship in under an hour from larger work.
  • Insists on measured contrast ratios via npx notugly (4.5:1 for text, 3:1 for UI components) instead of eyeballing screenshots, and suggests the nearest passing colour.
  • Adds testing guidance: keyboard-only pass, screen readers (VoiceOver/NVDA/JAWS), Axe DevTools, Lighthouse — plus anti-patterns like ARIA-as-a-bandaid.

Who it's for

  • Product designers, frontend engineers, and PMs responsible for a11y quality
  • Teams shipping to jurisdictions where WCAG AA is a legal baseline
  • Small teams doing a pre-launch accessibility sweep

Examples

  1. "Audit this checkout screen for accessibility" → principle-by-principle checklist plus prioritised remediation table.
  2. "Does #8ab4f8 text on white pass AA?" → computed ratio, APCA value, and a passing replacement colour.
  3. "Create an a11y remediation plan for our mobile onboarding flow" → quick wins split from sprint-sized fixes.

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/mohitagw15856/pm-claude-skills/HEAD/exports/openclaw/accessibility-audit/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

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 exports/openclaw/accessibility-audit folder from the GitHub repo mohitagw15856/pm-claude-skills into my ~/.claude/skills/mohitagw15856-accessibility-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/mohitagw15856/pm-claude-skills.git /tmp/pm-claude-skills && mkdir -p ~/.claude/skills/accessibility-audit && cp -r /tmp/pm-claude-skills/exports/openclaw/accessibility-audit/* ~/.claude/skills/accessibility-audit/

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

  1. Open a terminal.
  2. Clone the repo: git clone https://github.com/mohitagw15856/pm-claude-skills.git
  3. Create the skill folder: mkdir -p ~/.claude/skills/accessibility-audit
  4. Copy the files: cp -r pm-claude-skills/exports/openclaw/accessibility-audit/* ~/.claude/skills/accessibility-audit/
  5. Restart Claude Code and ask something like "Audit this design for accessibility" to trigger the skill.
  6. (Optional) For the contrast helper you need Node.js installed; verify with npx --yes notugly fix "#777777" "#ffffff".