react-uiux-design-first
CommunityDesign-first React UI UX for polished apps.
AuthorYoriichi-Dang
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill provides a design-first approach to building React user interfaces, prioritizing UX clarity, visual rhythm, accessibility, micro-interactions, loading states, and performance to reduce polish gaps during development.
Core Features & Use Cases
- Design-first methodology for React components and UI systems.
- Ensures consistent spacing, accessible controls, and polished interactions across apps.
- Use Case: develop a reusable button component library with clear focus, keyboard navigation, and responsive behavior at scale.
Quick Start
Inspect an existing component and implement a new UI element following the design-first guidelines: define UX goals, apply 8px spacing, add accessible labels and focus states, and review with a designer checklist.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 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: react-uiux-design-first Download link: https://github.com/Yoriichi-Dang/dashboard_web_template/archive/main.zip#react-uiux-design-first 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 223,000+ vetted skills library on demand.