a11y-audit

Audit UI components against WCAG 2.2 AA/AAA criteria and ARIA patterns with measured contrast checks.

Updated Jul 20, 2026
One-click install
npx skills add https://github.com/idy-00/paytrack --skill a11y-audit-idy-00
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: a11y-audit
Source: https://github.com/idy-00/paytrack/tree/main/backend/.agents/skills/a11y-audit
Command: npx skills add https://github.com/idy-00/paytrack --skill a11y-audit-idy-00

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Accessibility issues like insufficient contrast, missing keyboard navigation, and broken screen-reader semantics often slip into UI code unnoticed. This Skill audits interfaces against WCAG 2.2 and ARIA patterns, returning criterion-referenced findings with severity levels and concrete fixes instead of vague warnings. ## Core Features & Use Cases - WCAG 2.2 Compliance Audit: Evaluates components against POUR-organized criteria including newer rules like Focus Not Obscured (2.4.11), Target Size (2.5.8), and Accessible Authentication (3.3.8). - Measured Contrast Verification: Runs render-based scripts to measure actual contrast ratios for every text element and interactive state (default, hover, focus) rather than estimating by eye. - Severity-Ranked Findings: Outputs a findings table mapping each issue to a WCAG criterion, a P0/P1/P2 severity, and a specific fix. - Use Case: Before shipping a new checkout form, run an audit to confirm keyboard navigability, visible focus indicators, 4.5:1 text contrast, and proper ARIA name/role/state for screen readers. ## Quick Start Audit this checkout form component for WCAG 2.2 AA compliance and report any contrast, keyboard, or screen-reader issues with fixes.

Frequently Asked Questions about a11y-audit

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check a website for WCAG 2.2 compliance?

Run an accessibility audit that evaluates each component against POUR-organized WCAG 2.2 criteria, including keyboard navigation, focus visibility, contrast ratios, and target size. Findings are reported per criterion with severity levels and specific fixes.

How to measure color contrast ratios for accessibility?

Measure contrast programmatically rather than estimating visually. For rendered HTML, run scripts that compute ratios for every text element and interactive state; for loose color pairs, use a contrast calculation script with foreground and background values.

What changed in WCAG 2.2 compared to 2.1?

WCAG 2.2 adds criteria including Focus Not Obscured (2.4.11), Target Size Minimum of 24x24 CSS pixels (2.5.8), and Accessible Authentication (3.3.8). An audit should explicitly verify these additions alongside the existing AA requirements.

Does the audit check hover and focus states for contrast?

Yes. The verification scripts evaluate every interactive element in default, hover, and focus states, which catches contrast failures that only appear during interaction and would be missed by static checks.

What are the limitations of automated accessibility audits?

Automated checks reliably cover measurable criteria like contrast, target size, and ARIA attributes, but cannot fully judge screen-reader experience quality or cognitive usability. Manual testing with assistive technology remains necessary for complete coverage.