design-review

Name: design-review
Availability: InStock
Author: HerbertJulio

Audit frontend code for design consistency, accessibility, and UX patterns.

20|3|Updated Feb 22, 2026

Search Tags:#accessibility #a11y #frontend #design-review #design-systems #ui-audit

Ready to run

npx skills add https://github.com/HerbertJulio/specialist-agent --skill design-review-herbertjulio

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/HerbertJulio/specialist-agent/tree/main/skills/design-review
Command: npx skills add https://github.com/HerbertJulio/specialist-agent --skill design-review-herbertjulio

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill audits frontend code for design consistency, accessibility compliance, responsive behavior, and UX patterns, enabling teams to ship cohesive, accessible interfaces.

Core Features & Use Cases

Design-consistency checks across components, styles, and tokens
Accessibility auditing aligned with WCAG AA, including alt text, labels, contrast, and focus management
Responsive review covering breakpoints, mobile-first strategies, and fluid layouts
UX pattern validation for loading, empty, error, and success states across interfaces
Step-by-step guidance before deployment or after design-system updates

Quick Start

Run the design-review workflow on a frontend project to generate a comprehensive design and accessibility audit.

Frequently Asked Questions about design-review

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

FAQPage Schema

How do I audit frontend code for design consistency and accessibility compliance?▼

To audit frontend code for design consistency and accessibility compliance, run a project-wide review process that checks components and styles against design tokens and WCAG AA standards. This generates a structured report with specific file and line references.

What's the best way to check WCAG AA accessibility in JavaScript frontend projects?▼

Checking WCAG AA accessibility in JavaScript frontend projects involves auditing alt text, labels, contrast ratios, and focus management. A dedicated design-review workflow validates these accessibility patterns and outputs a structured report with file:line references.

Can I run a design review on a specific pull request instead of the whole project?▼

Yes, you can run a design review on a specific pull request. The auditing process supports PR-level checks alongside project-wide reviews, allowing targeted validation of design tokens, responsive behavior, and UX state conformance for new code changes.

How does a UX pattern validation check work for loading and error states?▼

UX pattern validation for loading and error states works by scanning frontend interfaces to ensure proper conformance across all interaction states. It verifies that loading, empty, error, and success states are implemented correctly and consistently throughout the project components.

Does the accessibility audit work with modern TypeScript frameworks and design tokens?▼

Yes, the accessibility audit works with modern JavaScript and TypeScript frameworks using common design tokens. It detects token usage to evaluate design consistency, responsive breakpoints, and accessibility compliance across the project's component library.

Why do I need a responsive review covering breakpoints and mobile-first strategies?▼

You need a responsive review covering breakpoints and mobile-first strategies to ensure fluid layouts adapt correctly across devices. This process validates responsive behavior and identifies design inconsistencies before deployment or after design-system updates.