gaia-validate-design-a11y

Validate design accessibility against WCAG 2.1 standards using Figma, wireframes, or UX documents.

2|Updated Apr 15, 2026
One-click install
npx skills add https://github.com/gaiastudio-ai/gaia-framework --skill gaia-validate-design-a11y
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: gaia-validate-design-a11y
Source: https://github.com/gaiastudio-ai/gaia-framework/tree/main/plugins/gaia/skills/gaia-validate-design-a11y
Command: npx skills add https://github.com/gaiastudio-ai/gaia-framework --skill gaia-validate-design-a11y

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill ensures that design artifacts meet accessibility standards before implementation, reducing the need for costly retrofits and improving user experience.

Core Features & Use Cases

  • Design Accessibility Validation: Checks color contrast, semantic structure, keyboard navigation, and ARIA landmark planning against WCAG 2.1 standards.
  • Verdict Production: Provides a clear verdict (APPROVE, REQUEST_CHANGES, BLOCKED) to guide the next steps.
  • Use Case: Before starting development on a new feature, use this Skill to validate the design's accessibility and catch potential issues early.

Quick Start

Run the gaia-validate-design-a11y skill with the design target URL or path: /gaia-validate-design-a11y [design-target].

Frequently Asked Questions about gaia-validate-design-a11y

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

FAQPage Schema
How do I validate design accessibility against WCAG 2.1 standards in Figma?

You can validate design accessibility by running the skill with your Figma target URL to check color contrast, semantic structure, and ARIA landmarks against WCAG 2.1 standards. It outputs a clear verdict to guide next steps.

What does WCAG 2.1 design validation check for before implementation?

WCAG 2.1 design validation checks color contrast, semantic structure, keyboard navigation, and ARIA landmark planning. It ensures design artifacts meet accessibility standards before development to reduce costly retrofits and improve user experience.

Do I need Figma API access to check wireframe accessibility?

Yes, you need Figma API access and a WCAG 2.1 rubric to validate wireframes or UX documents. The skill uses these dependencies to analyze design artifacts and produce an accessibility verdict.

Can I use UX documents instead of Figma files for accessibility validation?

Yes, you can validate design accessibility using Figma, wireframes, or UX documents. The skill evaluates these artifacts against WCAG 2.1 standards and returns a verdict of APPROVE, REQUEST_CHANGES, or BLOCKED.

What is the best way to catch accessibility issues before starting development?

The best way to catch accessibility issues early is to validate design artifacts against WCAG 2.1 standards before implementation. This process checks contrast and navigation, producing a verdict to prevent costly retrofits.

What are the limitations of design-time accessibility validation?

Design-time accessibility validation focuses on design artifacts and produces verdicts like APPROVE, REQUEST_CHANGES, or BLOCKED. It addresses design-time concerns but requires Figma API access and a WCAG 2.1 rubric to function properly.