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,335⑂ 234AI score 9/10Last updated: Sep 3, 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
- "Audit this checkout screen for accessibility" → principle-by-principle checklist plus prioritised remediation table.
- "Does #8ab4f8 text on white pass AA?" → computed ratio, APCA value, and a passing replacement colour.
- "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)
- Download the ZIP with the button below.
- In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
- Go to Customize → Skills → + → 'Upload a skill' and upload the 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.
- Open a terminal.
- Clone the repo:
git clone https://github.com/mohitagw15856/pm-claude-skills.git - Create the skill folder:
mkdir -p ~/.claude/skills/accessibility-audit - Copy the files:
cp -r pm-claude-skills/exports/openclaw/accessibility-audit/* ~/.claude/skills/accessibility-audit/ - Restart Claude Code and ask something like "Audit this design for accessibility" to trigger the skill.
- (Optional) For the contrast helper you need Node.js installed; verify with
npx --yes notugly fix "#777777" "#ffffff".
View source on GitHub ↗License: MIT