skills.rest
Canhada-Labs
Canhada-LabsOFFICIAL
Explore all skills by this author →
GitHub

Accessibility & WCAG Compliance

Check and enforce WCAG 2.1 AA compliance in frontend code.

2|Updated Jun 30, 2026
Search Tags:#accessibility#keyboard navigation#wcag#color contrast#aria
One-click install
npx skills add https://github.com/Canhada-Labs/ceo-orchestration --skill accessibility-wcag-compliance
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Accessibility & WCAG Compliance
Source: https://github.com/Canhada-Labs/ceo-orchestration/tree/main/.claude/skills/frontend/accessibility-and-wcag
Command: npx skills add https://github.com/Canhada-Labs/ceo-orchestration --skill accessibility-wcag-compliance

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a comprehensive solution for ensuring WCAG 2.1 AA compliance and accessibility in your frontend development, ensuring interactive components are accessible to all users.

Core Features & Use Cases

  • WCAG 2.1 AA Compliance: Check and enforce WCAG 2.1 AA standards for accessibility.
  • ARIA Patterns: Apply ARIA patterns to enhance accessibility.
  • Keyboard Navigation: Ensure keyboard accessibility for all interactive elements.
  • Use Case: When developing a new feature, use this Skill to review and enforce accessibility standards, ensuring that all interactive components meet the necessary guidelines.

Quick Start

Run the accessibility skill to review the accessibility of your current codebase.

Frequently Asked Questions about Accessibility & WCAG Compliance

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

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

To check WCAG 2.1 AA compliance, review your frontend code for proper color contrast ratios, semantic HTML structure, and complete keyboard navigation to ensure all interactive elements are accessible.

What is the best way to apply ARIA patterns for keyboard navigation?▼

The best way to apply ARIA patterns is to integrate them directly into your interactive components, ensuring semantic HTML is enhanced with roles and states that fully support keyboard navigation.

How do I fix color contrast and alt text issues for accessibility?▼

Fix color contrast and alt text issues by auditing your frontend components to verify that color ratios meet accessibility standards and that all meaningful images contain descriptive alt text attributes.

Does this accessibility check require any specific dependencies?▼

No specific dependencies are required to run these accessibility checks, allowing you to directly evaluate your frontend codebase for WCAG 2.1 AA standards, ARIA patterns, and keyboard navigation without external libraries.

When do I need to enforce WCAG standards in my development workflow?▼

You need to enforce WCAG standards when developing new frontend features, ensuring that interactive components meet accessibility guidelines for color contrast, ARIA patterns, and keyboard navigation before deployment.

Why does my interactive component fail keyboard accessibility checks?▼

Interactive components fail keyboard accessibility checks when they lack proper ARIA patterns or semantic HTML, preventing users from navigating and activating elements without a mouse.

Related Skills

Explore More Software Engineering Skills→
jonnabiojonnabio
6

accessibility-audit

Audits frontend interfaces for WCAP 2.1 AA compliance and accessibility best practices.

Community
Intermediate
arcasilesgrouparcasilesgroup
54

accessibility

Review frontend code for WCAG 2.1 AA compliance and report actionable findings.

Official
Advanced
Hack23Hack23
9

html-accessibility

Audit static HTML/CSS sites and implement WCAG 2.1 AA accessibility improvements.

Official
Intermediate
Nickalus12Nickalus12
2

a11y-audit

Audit Loom-style applications for WCAG violations and ARIA usage.

Community
Advanced