Can this skill help with color blindness testing?

Yes, the audit includes a color independence check and simulates how your palette appears under various conditions like protanopia, deuteranopia, and tritanopia.

What standards does the Accessibility Crit audit against?

It primarily checks against WCAG 2.1 Level AA standards by default, but it can be adjusted based on the requirements defined in your project brief.

Does it provide actual code fixes for the identified issues?

Yes, each remediation option includes specific implementation notes that detail the necessary HTML attributes, ARIA roles, and CSS changes required to fix the issues.

How are the audit results presented?

Results are generated as a standardized HTML document located in your project's .design-crit folder, featuring a summary dashboard and detailed severity-based findings.

When should I run this skill in my design process?

This skill is designed to run as the 'last facet' in the design-crit loop, auditing all accumulated decisions from layout, color, and component facets to ensure the final result is accessible.

Accessibility Design Critique

Name: Accessibility Design Critique
Author: metedata

bymetedata

0•

デザインツール

Performs comprehensive accessibility audits on UI designs to ensure WCAG compliance and inclusive user experiences.

Accessibility Design Critique is a specialized audit tool for Claude Code that evaluates UI designs against global accessibility standards. Operating as the final stage of a design critique loop, it systematically analyzes accumulated decisions across keyboard navigation, screen reader support, touch targets, color contrast, motion, and cognitive load. The skill generates detailed HTML audit reports with severity-based classifications and provides multiple remediation strategies, allowing developers and designers to balance accessibility requirements with aesthetic goals through interactive wireframe previews and implementation notes.

主な機能

01Detailed implementation guidance including ARIA roles, HTML attributes, and CSS

02Automated WCAG 2.1 compliance auditing across six key accessibility categories

03Generation of structured HTML audit reports with critical, major, and minor findings

04Cross-facet analysis of typography, color systems, and component architecture

050 GitHub stars

06Visual remediation strategies with 'before and after' wireframe comparisons

ユースケース

01Conducting a final accessibility validation on a UI design before moving to production

02Identifying contrast and navigation gaps in existing design systems or wireframes

03Comparing different remediation strategies to find the best balance between design and compliance

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add metedata/design-crit crit-accessibility

For use in Claude.ai and ChatGPT

Download Skill