accessibility

Audit frontend components for WCAG 2.1 AA compliance.

1|Updated Jul 15, 2026
One-click install
npx skills add https://github.com/Dzakiamriz22/frontend-pack --skill accessibility-dzakiamriz22
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: accessibility
Source: https://github.com/Dzakiamriz22/frontend-pack/tree/main/skills/accessibility
Command: npx skills add https://github.com/Dzakiamriz22/frontend-pack --skill accessibility-dzakiamriz22

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill addresses the critical gap between functional UI and inclusive design by enforcing WCAG 2.1 AA standards, ensuring applications are usable by everyone regardless of physical or cognitive ability.

Core Features & Use Cases

  • Automated Auditing: Scans components for color contrast, semantic HTML, and ARIA compliance.
  • Focus Management: Implements robust keyboard navigation and focus trapping for modals and interactive elements.
  • Use Case: When building a complex dashboard, use this skill to verify that all data tables and navigation menus are fully accessible to screen readers and keyboard-only users.

Quick Start

Use the accessibility skill to audit the current component for WCAG 2.1 AA compliance and suggest necessary fixes.

Frequently Asked Questions about accessibility

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

FAQPage Schema
How do I check my frontend components for WCAG 2.1 AA compliance?

To check frontend components for WCAG 2.1 AA compliance, scan them for color contrast ratios, semantic HTML structure, and ARIA role implementation to ensure interfaces are perceivable and operable.

What is the best way to implement keyboard navigation and focus trapping in web modals?

Implementing keyboard navigation and focus trapping in web modals requires robust focus management to ensure interactive elements are fully operable by keyboard-only users without losing context.

How do I make complex dashboard data tables accessible to screen readers?

To make complex dashboard data tables accessible to screen readers, apply semantic HTML tags and ARIA roles so the navigation menus and data structures are properly announced to assistive technologies.

Does this accessibility audit support interactive web forms and navigation systems?

Yes, this accessibility audit supports interactive web forms and navigation systems by verifying keyboard support and enforcing WCAG 2.1 AA standards across all frontend user interface elements.

Why does my UI fail color contrast requirements for inclusive design?

Your UI fails color contrast requirements for inclusive design when the visual presentation does not meet the minimum WCAG 2.1 AA contrast ratios required for perceivable content.