docs-a11y
Audits and fixes accessibility issues on the documentation site.
Install
mkdir -p .claude/skills/docs-a11y && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/11964" && unzip -o skill.zip -d .claude/skills/docs-a11y && rm skill.zipInstalls to .claude/skills/docs-a11y
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Audit and improve the accessibility of the timepicker-ui documentation site (docs-app/) - landmarks, heading order, skip links, keyboard nav, focus management in the command menu / sidebar / dialogs, color contrast, alt text, ARIA on custom components, Radix usage, reduced motion - against WCAG 2.2 AA. Use when the user wants an a11y audit/fix of the docs site. Drives the docs-accessibility subagent in an audit → approve → apply flow. Does NOT cover the library (use /a11y for that).Key capabilities
- →Dispatch a subagent to audit documentation accessibility
- →Group audit findings into categories like structure, keyboard, names/roles/contrast, content/media, and motion/responsiveness
- →Present audit findings with WCAG references and file-level plans
- →Apply approved accessibility fixes to the documentation site
- →Verify applied fixes by offering to run build/lint/a11y passes
How it works
The skill dispatches a subagent to audit the documentation site against WCAG 2.2 AA standards, presents the findings for approval, and then applies the approved fixes.
Inputs & outputs
When to use docs-a11y
- →Audit documentation accessibility
- →Fix keyboard navigation issues
- →Improve WCAG compliance
About this skill
Docs Accessibility (a11y)
Make the timepicker-ui documentation site (docs-app/, Next.js 16) usable by keyboard and
assistive technology. This skill is a thin orchestrator: the real work is done by the
docs-accessibility subagent. The skill exists to hold the approval gate the subagent
can't run itself.
Standard: WCAG 2.2 AA. Scope is docs-app/ only - the library is /a11y.
Arguments (optional)
- A focus area narrows the run, e.g.
/docs-a11y nav,/docs-a11y command-menu,/docs-a11y contrast,/docs-a11y headings,/docs-a11y keyboard. No argument = full audit. --apply-allskips the per-area approval prompt and applies the whole audited plan (still reports- verifies). Use only for an explicitly unattended run.
Workflow
Phase 1 — Audit (read-only)
Dispatch the docs-accessibility subagent (Task tool, subagent_type: docs-accessibility) in
audit mode, with the focus area if given. Ask for a prioritized, file-level plan grouped into:
- Structure & landmarks (one
<main>, nav/header/footer, skip link, heading order) - Keyboard & focus (command menu, mobile sidebar, dialogs: trap/Escape/focus-return, visible focus,
aria-expanded/aria-current) - Names, roles, contrast (icon-button labels, decorative
aria-hidden, ≥4.5:1 text contrast in light AND dark) - Content & media (
lang, descriptive links, labelled copy buttons, alt text) - Motion & responsiveness (
prefers-reduced-motion, reflow at 320px / 400% zoom) Each finding cites its WCAG reference and the exact file + change. No edits.
Phase 2 — Present & approve (gate)
Relay the plan concisely (grouped, with references). Use AskUserQuestion to approve all, pick
which groups/items to apply, or skip. Capture the approved set. Do not skip this gate unless
--apply-all was passed.
Phase 3 — Apply
Dispatch docs-accessibility again in apply mode with the exact approved list. It implements
fixes (landmarks, headings, aria-*, focus management, labels, contrast/markup) in docs-app's own
TS/App-Router style and line endings, using Radix primitives correctly and adding no heavy deps.
Phase 4 — Verify & report
- Offer to run
npm run build/npm run lint(and an axe/Lighthouse a11y pass if tooling is available) insidedocs-app/. Report real output; never assume green. - Summarize what changed, grouped by the five areas, with the file list.
- Give the manual checklist: keyboard-only walkthrough (header → command menu → sidebar → a docs page), Escape/focus-return on the menus, a screen-reader pass on one page, and a contrast check in both light and dark themes.
- Flag anything that's actually a library a11y bug (seen via a live demo) for
/a11y, and any visual/content redesign fordocs-site.
Guardrails
docs-app/only; never edit the library inapp/ordist/.- Match docs-app conventions and line endings (not the library's CRLF rule).
- Accessibility, not redesign; no new heavy a11y dependencies without flagging.
- This skill audits/fixes; git and deploy stay with the user.
When not to use it
- →When auditing the library itself instead of the documentation site
- →When applying fixes without prior approval, unless `--apply-all` is passed
- →When the task involves visual or content redesign rather than accessibility fixes
Limitations
- →It only covers the `docs-app/` documentation site, not the library.
- →It requires approval before applying fixes, unless `--apply-all` is used.
- →It does not involve visual or content redesign.
How it compares
This skill orchestrates a structured audit-approve-apply workflow for documentation accessibility, including a human approval gate, unlike directly applying fixes or performing a manual audit.
Compared to similar skills
docs-a11y side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| docs-a11y (this skill) | 0 | 2mo | No flags | Advanced |
| roier-seo | 4 | 6mo | Review | Intermediate |
| audit | 0 | 3mo | No flags | Intermediate |
| full-review | 0 | 3mo | Review | Advanced |
Try saying
Example prompts that trigger this skill in your AI assistant.
You might also like
roier-seo
davila7
Technical SEO auditor and fixer. Runs Lighthouse/PageSpeed audits on websites or local dev servers, analyzes SEO/performance/accessibility scores, and automatically implements fixes for meta tags, structured data, Core Web Vitals, and accessibility issues.
audit
educlopez
Technical UI audit — a11y, performance, responsive. Produces a prioritized findings table. Invoke when the user asks for audit on their UI, or mentions 'audit' alongside design / UI / frontend work.
full-review
Trophalaxeur
Analyse complète du repository Bismuth (Astro 6 / React / Tailwind v4). Détecte le code mort, fichiers inutilisés, mauvaises pratiques, problèmes qualité, SEO et accessibilité. Produit un fichier Markdown avec liens VSCode cliquables.
a11y-audit
jarbitechture
Accessibility audit skill for scanning, fixing, and verifying WCAG 2.2 Level A and AA compliance across React, Next.js, Vue, Angular, Svelte, and plain HTML codebases. Use when auditing accessibility, fixing a11y violations, checking color contrast, generating compliance reports, or integrating acce
shadcn-ui-setup
maneeshanif
Install and configure Shadcn/ui component library with Radix UI primitives, Aceternity UI effects, set up components, and manage the component registry. Use when adding Shadcn/ui to a Next.js project or installing specific UI components for Phase 2.
elegant-design
rand
Create world-class, accessible, responsive interfaces with sophisticated interactive elements including chat, terminals, code display, and streaming content. Use when building user interfaces that need professional polish and developer-focused features.