What viewport sizes does it test?

By default, it checks common breakpoints, but you can specify custom viewport sizes (e.g., mobile, tablet, desktop) to ensure your UI is responsive across all devices.

Does it support custom design systems?

Yes, you can pass a path to your design system documentation as an input parameter, allowing the skill to verify your components against your specific brand guidelines.

Is the accessibility check fully WCAG compliant?

It performs essential checks such as color contrast and touch targets. For deep, comprehensive compliance, it is designed to integrate with specialized tools like the accessibility-audit skill.

Can this skill fix UI issues automatically?

The ui-review skill identifies and prioritizes issues in a detailed report. While it doesn't edit code directly, you can use the report's recommendations to prompt Claude to perform the necessary remediation.

UI Review & UX Auditor

Name: UI Review & UX Auditor
Author: xarlord

byxarlord

0•

Design Tools

Performs comprehensive UI/UX audits to ensure visual consistency, accessibility compliance, and design system adherence in frontend implementations.

This skill automates the design review process within the Claude Code environment, allowing developers to validate their frontend implementations against industry best practices. It analyzes specific screens and components for visual hierarchy, usability patterns, and responsive behavior, providing a structured report with prioritized issues ranging from critical fixes to minor polish. By integrating accessibility checks and design system verification directly into the development workflow, it helps teams maintain high-quality UI standards and catch design regressions before they reach production.

Key Features

01Automated visual design analysis for layout, typography, and color consistency

02Basic accessibility auditing for color contrast, touch targets, and focus indicators

03Cross-viewport responsive behavior testing for mobile, tablet, and desktop

040 GitHub stars

05Design system compliance verification using local documentation paths

06Structured reporting with prioritized issue tracking and remediation guidance

Use Cases

01Ensuring consistency across multiple screens during large-scale frontend refactors

02Auditing legacy components for modern accessibility and usability standards

03Validating UI implementation accuracy against design mockups before a release

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add xarlord/devflow-enforcer ui-review

For use in Claude.ai and ChatGPT