Apply ARIA labeling and semantic markup to React UI components.
npx skills add https://github.com/Dayopt/app --skill a11y-dayopt
Please help me install this Agent Skill. Skill: a11y Source: https://github.com/Dayopt/app/tree/main/.claude/skills/a11y Command: npx skills add https://github.com/Dayopt/app --skill a11y-dayopt
This skill helps teams implement accessible interactive UI elements by providing guidelines and checks that align with WCAG 2.1 AA and Radix/shadcn UI accessibility patterns.
Audit your next interactive component by applying a11y guidelines to ensure ARIA labeling, keyboard navigation, and proper focus management.
High-intent search queries and answers about installing and using this skill.
To add proper ARIA attributes and semantic markup, apply accessibility guidelines during development of buttons, inputs, and dialogs. This ensures correct roles and labeling across custom interactive components using shadcn/ui and Radix UI patterns.
Managing keyboard navigation and focus for modal dialogs requires applying specific focus management patterns. This ensures screen reader compatibility and proper focus trapping when interacting with modal, dialog, and drawer components in React applications.
Yes, this accessibility approach works directly with shadcn/ui and Radix UI components. It provides guidelines and checks that align with their built-in accessibility patterns to ensure WCAG 2.1 AA compliance across your interactive UI elements.
Checking if interactive UI elements meet WCAG 2.1 AA requirements involves auditing components against accessibility guidelines. This validates ARIA labeling, keyboard navigation, and focus management to deliver compliant user experiences.
Custom button components fail screen reader accessibility checks when missing proper ARIA labeling and semantic markup. Applying accessibility guidelines ensures correct roles and labels, satisfying screen reader compatibility and WCAG 2.1 AA requirements.
You need to apply accessibility guidelines during the development of interactive UI elements like buttons, inputs, and dialogs. Applying checks early ensures ARIA, keyboard, and focus management requirements are met before deployment.
mostafasudoAutomate discovery, installation, and customization of shadcn/ui components in React applications.
samjhechtVerify frontend UI accessibility compliance with axe-core, keyboard, screen reader, and Lighthouse audits.
videojsAudit React UI components for ARIA accessibility and keyboard navigation.
knckknckIdentify and fix HTML accessibility issues in interactive UI controls and forms.
