frontend-design-review

Analyze frontend UI implementations for design system compliance and accessibility.

Updated Aug 23, 2026

Search Tags:#accessibility #frontend #design-system #design-tokens #design-review #component-review #ui-aesthetics

Ready to run

npx skills add https://github.com/javi2481/proyecto-data-x --skill frontend-design-review-javi2481

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: frontend-design-review
Source: https://github.com/javi2481/proyecto-data-x/tree/main/.claude/skills/frontend-design-review
Command: npx skills add https://github.com/javi2481/proyecto-data-x --skill frontend-design-review-javi2481

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Review UI implementations for design system compliance, visual quality, and accessible front-end craftsmanship.

Core Features & Use Cases

Evaluate UI implementations against design tokens, spacing, typography, and accessibility guidelines.
Perform design-system-aware reviews for PRs, design audits, and component-level feedback.
Provide actionable recommendations and documentation to align with design system principles.

Quick Start

Initiate a design-review pass on a UI component or PR to generate a comprehensive report.

Frequently Asked Questions about frontend-design-review

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

FAQPage Schema

How do I review UI implementations for design system compliance?▼

To review UI implementations for design system compliance, analyze the component against design tokens, spacing, typography, and accessibility guidelines to ensure consistent aesthetics and usable interactions. This generates a comprehensive report with actionable recommendations and documentation for any deviations.

Can I evaluate frontend accessibility and visual quality in a PR review?▼

Yes, you can evaluate frontend accessibility and visual quality during a PR review by performing design-system-aware checks. This verifies design-token usage, responsiveness, and clear accessibility standards to align the PR with design system principles.

What is the best way to audit web interfaces for design token usage?▼

The best way to audit web interfaces for design token usage is to perform a component-level review that verifies token application across spacing and typography. This ensures consistent UI aesthetics and satisfies design system requirements while documenting necessary deviations.

Does a frontend design review check responsiveness and documented deviations?▼

Yes, a frontend design review includes clear accessibility and responsiveness checks while verifying design-token usage. It ensures that any necessary deviations from the design system are properly documented to maintain overall visual quality and compliance.