accessibility-auditing

Q: How do I install accessibility-auditing?

Run npx skills add https://github.com/spencerpauly/awesome-cursor-skills --skill accessibility-auditing in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/accessibility-auditing/ (personal) or .claude/skills/accessibility-auditing/ (project).

by spencerpaulyFrontend & Design

Use Cursor's browser aria snapshots to audit a page for accessibility issues — missing labels, broken tab order, contrast, and ARIA misuse.

Installs: 518
Last 24h: —
Trending rank: —
Security: Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/spencerpauly/awesome-cursor-skills --skill accessibility-auditing

01
Install
Run the command in your project. The CLI asks which agents to install for.
02
Describe the task
Ask your agent for something this skill covers. It loads accessibility-auditing automatically when relevant.
03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

Accessibility Auditing

Audit a web page for accessibility issues using Cursor's built-in browser without external tools.

Workflow

1. Open the Page

Use browser_navigate to open the target URL.

2. Capture the Accessibility Tree

Use browser_snapshot — this returns the aria/accessibility tree of the page. This is the same tree that screen readers use.

3. Audit the Tree

Check for these issues:

Missing Labels

button elements with no accessible name (no text, no aria-label)
img elements with no alt text
input elements with no associated label or aria-label
a (link) elements with no text content
Icon-only buttons missing aria-label

Semantic HTML

Clickable div or span elements → should be button or a
Missing nav, main, header, footer landmarks
Headings that skip levels (h1 → h3)
Lists that aren't using ul/ol/li

Keyboard Navigation

Interactive elements missing from tab order
Custom widgets without role and keyboard handlers
Focus traps in modals (should trap focus, but also allow Escape to close)
Skip-to-content link missing

ARIA Issues

aria-hidden="true" on focusable elements
Invalid role values
aria-expanded without corresponding collapsible content
aria-controls pointing to non-existent IDs

Contrast (use screenshot for visual check)

Light gray text on white backgrounds
Placeholder text that's too faint
Disabled states that are indistinguishable

4. Test Keyboard Navigation

Use browser_press to simulate Tab key presses and verify:

Every interactive element receives focus
Focus order is logical (top-to-bottom, left-to-right)
Focus is visible (focus ring or outline)
Escape closes modals/dropdowns

5. Report

Accessibility Audit:
  Critical:
    - 3 buttons with no accessible name (header icons)
    - Login form inputs missing labels
  Warnings:
    - Heading levels skip from h1 to h3
    - No skip-to-content link
    - 2 clickable divs should be buttons
  Passed:
    - All images have alt text
    - Landmarks present (nav, main, footer)
    - Focus order is logical

6. Fix

For each issue, apply the fix in the source code. Common fixes:

Add aria-label="Close" to icon buttons
Wrap inputs in <label> or add htmlFor
Change <div onClick> to <button>
Add alt text to images
Fix heading hierarchy

FAQ

What does the accessibility-auditing skill do?

Use Cursor's browser aria snapshots to audit a page for accessibility issues — missing labels, broken tab order, contrast, and ARIA misuse.

How do I install accessibility-auditing?

Run npx skills add https://github.com/spencerpauly/awesome-cursor-skills --skill accessibility-auditing in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/accessibility-auditing/ (personal) or .claude/skills/accessibility-auditing/ (project).

Which AI agents can use accessibility-auditing?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is accessibility-auditing safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains accessibility-auditing?

It is published by spencerpauly in spencerpauly/awesome-cursor-skills. It has 518 recorded installs.