better-accessibility skill: review and fix keyboard, focus and ARIA problems

Makes Claude review and fix keyboard, focus, ARIA, forms, motion and zoom problems against WCAG 2.2.

Installs: 32.2K; on skills.sh
Stars: 10K; on GitHub
Files: 7; besides SKILL.md
Updated: Oct 2026; last repo commit

better-accessibility makes Claude walk your interface twice: once with the keyboard only, once as a screen reader user. Each failure is reported against the WCAG 2.2 criterion it breaks, with a fix written in your project's own styling system. It prefers native HTML elements and removing ARIA over adding it.

It owns semantics, focus, names, forms, announcements, motion and zoom. Contrast fixes, text sizing, spacing and wording belong to sibling skills in the same repo. It ends a review with Block or Approve.

Good for

Front-end developers who need WCAG 2.2 fixes in their own stack
Teams preparing for an accessibility audit
Designers checking keyboard and screen reader flows

Install better-accessibility

Claude Code

Copy this prompt.

Install the better-accessibility skill in Claude Code. Run this command:

npx skills add https://github.com/jakubkrehel/skills --skill better-accessibility

Then check that it loaded and tell me how to use it.

2
Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js.

From its listing on skills.sh. Source.

What's in the skill

When it loads

Reviews and fixes keyboard and focus behavior, ARIA, accessible names, forms, screen-reader announcements, motion and zoom against WCAG 2.2.

Sections in SKILL.md

Criteria, not conventions
Native elements first
Disabled means unavailable
Visible focus rings
Full keyboard support
Trap and restore focus
Minimum hit area
Label and type every control
Errors that announce
Accessible names everywhere
Pair color with a second cue
Honor prefers-reduced-motion
Nothing the user needs runs on a timer
Announce dynamic content
Alt text by purpose
Structure is navigation

Key facts

Author: jakubkrehel (Jakub Krehel)
Repo: jakubkrehel/skills
Installs on skills.sh: 32,165 as of Nov 2, 2026
GitHub stars: 10,003 for the whole jakubkrehel/skills repo, Nov 2, 2026
License: MIT
Last repo commit: Oct 25, 2026
What is inside: 8 files including SKILL.md: 6 reference guides and agents/openai.yaml
skills.sh audits: Gen Agent Trust Hub pass, Socket pass, Snyk pass
Standard: WCAG 2.2 Level A and AA; each finding cites a criterion number or a task a user cannot complete
Reference guides: focus-and-keyboard, forms, hit-areas, motion-and-zoom, screen-readers, semantics-and-aria
Pairs with: better-colors, better-typography, better-layout, better-writing, better-ui; better-interface runs them together

What it includes

Keyboard-only walk, then screen-reader walk, of every flow
Keyboard: every flow completes without a mouse. Screen reader: every control announces name, role and state.
Try: “Review the signup form for keyboard and screen reader problems.”
Read · Two walks
Findings cite a WCAG 2.2 A or AA criterion; the rest are recommendations
Criteria, not conventions
button for actions, a href for links, never div onClick
Write · Native elements first
Native disabled, or aria-disabled only if it must stay focusable
Disabled means unavailable
Style :focus-visible; never remove the outline without a verified replacement
Visible focus rings
Escape closes overlays; arrows inside widgets; no positive tabindex
Full keyboard support
Prefer dialog with showModal(); return focus to the trigger on close
Trap and restore focus
24x24 CSS px is the WCAG 2.2 AA baseline; aim for 44px touch, 40px desktop
Also: a single-pointer alternative for every drag.
Minimum hit area
Real labels, autocomplete tokens, right input type, never block paste
Label and type every control
Validate on submit; aria-invalid, aria-describedby, focus the first bad field
Errors that announce
Icon-only buttons get an aria-label that starts with the visible text
Accessible names everywhere
Motion is opt-in; swap slides and scales for cross-fades
Honor prefers-reduced-motion
Anything moving for more than 5 seconds needs a visible pause control
Nothing the user needs runs on a timer
describedby for fields, role=status for toasts, role=alert only for urgent errors
Announce dynamic content
Decorative alt empty, informative describes meaning, functional describes the action
Alt text by purpose
Real headings, one main landmark, a skip link when chrome repeats
Structure is navigation
200% resize, reflow at 320px, never maximum-scale=1 or user-scalable=no
Survive zoom and text resize
One row per root cause with location, before, after and why; ends in Block or Approve
Without a browser it checks names, handlers, focus styles, motion guards and labels; with one it tabs the flow and runs an audit.
Runs code · Reporting

From the official docs

Permissions

Low risk

It reads your code and edits it when you ask for fixes. Work on a branch and read the diff, especially focus styles and ARIA changes.

What it can do

Read your data
Create and change things
Delete things
Read-only mode

Watch out for

It edits your code when it fixes
The skill both reviews and fixes. Work on a branch and read the diff, especially around focus styles and ARIA. github.com
Browser checks run against your app
When a browser is available it tabs the flow and runs an automated audit. Point it at a dev or staging site, not production data. github.com

Security advisories

No published security advisories as of Nov 2, 2026.

Technical details

Turning on read-only	SKILL.md defines no read-only switch. Ask for a review only, or say not to edit files.
Sign-in and keys	SKILL.md names no credentials or sign-in.
Scopes	Claude reads your source files Claude edits your code when you ask for the fixes With a browser, Claude can tab through your running app and run an automated audit

Questions

What does better-accessibility do?

It makes Claude review and fix keyboard and focus behaviour, ARIA, accessible names, forms, screen reader announcements, motion and zoom against WCAG 2.2. Each finding names the criterion it breaks and the fix in your styling system.

How do I install better-accessibility?

Use the install box at the top of this page. It installs this skill and its six guide files. The repo's AGENTS.md says a single skill can be installed alone.

Does it fix problems or only report them?

Both. The skill is described as reviewing and fixing. A review ends with Block when any high-severity item remains and Approve otherwise.

Does it check colour contrast?

It decides which contrast rule applies, such as 4.5:1 for text, but measuring the pair and fixing colours belongs to the better-colors skill. Without it, Claude reports the pair and the criterion and leaves the colours alone unless you ask.

better-accessibility vs better-interface?

better-accessibility covers accessibility only. better-interface runs it with five other topic skills (layout, writing, typography, color and UI polish) and merges everything into one ranked report.

Do I need a browser or screen reader?

No. Without a browser it checks accessible names, keyboard handlers, focus styles, reduced motion guards and form labels in the code. With one it tabs through the flow and runs an automated audit. Checks it cannot run are reported as Not verified.

Is better-accessibility safe?

It reads your code and, when you ask for fixes, edits it. It bundles no scripts. If you let it open a browser or run an audit, read the command first.

Information

updated Nov 2, 2026

Repository: jakubkrehel/skills
Folder: skills/better-accessibility

jakubkrehel/skills skills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 4

better-accessibility SKILL.md · github.com
jakubkrehel/skills README · github.com
AGENTS.md · github.com
skills.sh listing · skills.sh