skills.rest
btabaska
btabaskaCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

Accessibility Check

Detect WCAG 2.1 AA accessibility defects in Next.js/React components.

1|1|Updated Mar 31, 2026
Search Tags:#accessibility#a11y#frontend#react#verification#wcag#jsx
One-click install
npx skills add https://github.com/btabaska/simpler-grants-documentation-automation --skill accessibility-check-btabaska
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Accessibility Check
Source: https://github.com/btabaska/simpler-grants-documentation-automation/tree/main/.cursor/skills/skill-accessibility-check
Command: npx skills add https://github.com/btabaska/simpler-grants-documentation-automation --skill accessibility-check-btabaska

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Audit frontend code for WCAG 2.1 AA compliance to catch common accessibility issues early before CI.

Core Features & Use Cases

  • Deterministic checks for ARIA usage, color contrast, semantic HTML, keyboard navigation, and missing alt text.
  • Generate structured findings with actionable fix suggestions and file:line citations.
  • Use during development or PR review to surface accessibility defects quickly.

Quick Start

Run an a11y check on a frontend file path such as frontend/src/components/Search.tsx and review the findings.

Frequently Asked Questions about Accessibility Check

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

FAQPage Schema
How do I check my React components for WCAG 2.1 AA accessibility defects?▼

To check React components for WCAG 2.1 AA accessibility defects, run a deterministic scan on your JSX file paths. This identifies ARIA usage, color contrast, semantic HTML, and keyboard navigation issues without modifying your source code.

Can I run a local accessibility check on Next.js code during a pull request review?▼

Yes, you can run local accessibility checks on Next.js code during pull request reviews. The scan outputs structured findings with actionable fix suggestions and file:line citations, surfacing frontend a11y defects quickly before CI.

What common frontend a11y issues are detected by an automated WCAG checker?▼

An automated WCAG checker detects common frontend a11y issues including incorrect ARIA usage, poor color contrast, missing alt text, invalid semantic HTML, and keyboard navigation defects. It applies guardrail-aware checks to edited frontend code.

Does the accessibility check automatically fix ARIA and semantic HTML issues in JSX files?▼

No, the accessibility check does not automatically fix ARIA and semantic HTML issues in JSX files. It only detects and reports WCAG 2.1 AA defects, providing structured findings with suggestions and file citations while leaving source code unmodified.

When should I run a WCAG 2.1 AA accessibility check in my frontend development workflow?▼

You should run a WCAG 2.1 AA accessibility check during frontend development or PR review. Running local deterministic checks on edited React or Next.js components helps catch common a11y issues early before committing code to CI pipelines.

Related Skills

Explore More Software Engineering Skills→
CrazyDubyaCrazyDubya

accessibility-auditor

Audit web applications for WCAG 2.1 Level AA accessibility compliance.

Community
Intermediate
AGMO-IncAGMO-Inc
4

accessibility

Detect WCAG accessibility issues in React/HTML/CSS via static review.

Official
Intermediate
HouseGarofaloHouseGarofalo
3

frontend-testing

Test React applications with Jest, Vitest, React Testing Library, and Playwright.

Official
Advanced
Rosetears520Rosetears520
2

browser-testing-with-devtools

Inspect live DOM, console output, network traffic, and visual state in Playwright browser tools.

Community
Intermediate