skills.rest
djnsty23
djnsty23COMMUNITY
Explore all skills by this author →
GitHub

a11y

Audit React applications for WCAG 2.1 AA accessibility compliance.

2|Updated Jan 12, 2026
Search Tags:#accessibility#a11y#react#wcag#semantic-html#keyboard-navigation#focus-management
One-click install
npx skills add https://github.com/djnsty23/claude-auto-dev --skill a11y-djnsty23
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: a11y
Source: https://github.com/djnsty23/claude-auto-dev/tree/main/skills/a11y
Command: npx skills add https://github.com/djnsty23/claude-auto-dev --skill a11y-djnsty23

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill enables teams to identify and remediate WCAG 2.1 AA accessibility gaps in React applications, reducing manual testing time and increasing conformance.

Core Features & Use Cases

  • Keyboard navigation audits across dashboards and modal dialogs to ensure focus is visible and operable.
  • Focus management checks and ARIA/semantic HTML validation to improve screen reader compatibility.
  • Color contrast reviews and perceivable content guidance to meet WCAG recommendations across UI components.

Quick Start

Run automated accessibility checks on your React app to identify WCAG 2.1 AA issues.

Frequently Asked Questions about a11y

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

FAQPage Schema
How do I audit a React app for WCAG 2.1 AA accessibility compliance?▼

Auditing React applications for WCAG 2.1 AA accessibility compliance involves reviewing keyboard navigation, focus management, color contrast, ARIA roles, and semantic HTML across pages and modals to identify issues and guide fixes.

What does a WCAG 2.1 AA accessibility audit cover in React component libraries?▼

A WCAG 2.1 AA accessibility audit covers keyboard navigation operability, focus management visibility, screen reader compatibility via ARIA and semantic HTML validation, and color contrast reviews to ensure perceivable content across UI components.

How do I check keyboard navigation and focus management in React modals?▼

Checking keyboard navigation and focus management in React modals involves verifying that focus is visible and operable within dialog components, ensuring users can navigate the modal interface without a mouse and that focus is trapped or restored appropriately.

Can I use automated checks to validate ARIA roles and semantic HTML in React dashboards?▼

Yes, automated accessibility checks can validate ARIA roles and semantic HTML in React dashboards to improve screen reader compatibility. These checks are combined with practical guidelines to identify conformance gaps and generate reporting outputs.

What is the best way to review color contrast for WCAG compliance in React applications?▼

The best way to review color contrast for WCAG compliance in React applications is to perform perceivable content guidance checks across UI components. This ensures that visual elements meet WCAG recommendations for accessibility.

Does this accessibility audit work for both component libraries and dashboards?▼

Yes, this accessibility audit is applicable to both React component libraries and dashboards. It effectively covers keyboard navigation, focus management, and semantic HTML validation across these interface types.

Related Skills

Explore More Software Engineering Skills→
TamtitamTamtitam

aria-accessibility-fixer

Review and correct ARIA attributes in frontend HTML for WCAG compliance.

Community
Intermediate
kennedym-dskennedym-ds
14

accessibility-wcag

Evaluate and implement WCAG 2.1 AA accessibility patterns for frontend web development.

Community
Advanced
raybargasraybargas

Frontend Accessibility

Enforce frontend accessibility compliance in web UI code.

Community
Basic
DexploarerDexploarer
6

wcag-compliance-checker

Audits web applications for WCAG 21 Level AA conformance using axe-core, pa11y, Lighthouse, and outputs remediation recommendations.

Community
Advanced