verify-frontend-ui
CommunityEnsure UI quality and consistency.
Authorbigbulgogiburger
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill automates the verification of frontend UI components against established design principles, accessibility standards, and technical best practices, ensuring a high-quality and consistent user experience.
Core Features & Use Cases
- Design System Compliance: Verifies adherence to design tokens (HSL CSS variables, Tailwind semantic classes).
- Accessibility Audit: Checks for ARIA roles, labels, keyboard navigation, and focus management.
- Responsiveness & Theming: Validates dark mode compatibility and mobile responsiveness.
- Use Case: After updating the
Button.tsxcomponent and modifying Tailwind theme colors intailwind.config.ts, run this Skill to confirm that the changes maintain accessibility, dark mode support, and adhere to the design system.
Quick Start
Run the UI verification checks for the frontend components.
Dependency Matrix
Required Modules
None requiredComponents
scriptsreferences
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: verify-frontend-ui Download link: https://github.com/bigbulgogiburger/rag-bio/archive/main.zip#verify-frontend-ui Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.