Practical UI Agent

概要

This skill equips an AI agent to perform comprehensive UI audits and implement evidence-based design systems. It provides structured, executable workflows for analyzing existing code against best practices in accessibility, spacing, typography, and color contrast. Use this skill to systematically review a user interface, refactor frontend code for consistency and WCAG compliance, or to establish a complete, production-ready design system from scratch, complete with CSS custom properties, button hierarchies, and accessible forms.

主な機能

• Accessibility checks for forms and WCAG compliance
• Generates structured reports with actionable fix recommendations
• Step-by-step workflow for implementing a new design system
• Provides best-practice CSS for tokens, buttons, and forms
• Automated UI audits for color contrast, spacing, and typography
• 0 GitHub stars

ユースケース

• Conducting a comprehensive UI and accessibility audit of a web application.
• Establishing a new, consistent design system for a project.
• Refactoring existing CSS to align with modern best practices and accessibility standards.