Accessibility Audit

My prompt for putting a page through an accessibility pass — keyboard, focus, contrast and semantics — and getting back prioritized, concrete fixes rather than a vague "improve a11y."

When to use it

Before I ship anything user-facing, and whenever I touch interactive UI. It pairs with the Accessibility checklist: use that as the standard, use this prompt to apply it. The Morpha base already covers a lot via radix-ui primitives — this catches what composition introduced.

Prompt

Audit <page or component path/URL> for accessibility against WCAG 2.1 AA.

Check, and report findings for, each of:
- Keyboard: every interactive element reachable and operable; logical tab order;
  no traps.
- Focus: visible focus indicators; focus moved correctly on open/close of overlays.
- Contrast: text and UI contrast meets AA against our tokens (light and dark).
- Semantics/ARIA: correct roles, names, states; landmarks; labelled form controls.
- Motion: respects prefers-reduced-motion.
- Images/icons: meaningful alt text; decorative elements hidden from AT.

For each issue: severity, the specific element, why it fails, and a concrete fix
(ideally a diff). Order findings by severity. Skip anything already compliant.

Variants

• Single component: scope the first line to one component and add "Include the keyboard interaction spec it should follow (e.g. WAI-ARIA pattern)."
• Quick triage: ask for "only blocker- and critical-severity issues" to get a shippable shortlist fast.
• With tooling: tell the agent to cross-check against axe DevTools / Lighthouse output if I paste it in (see Design & Assets).