components-build
✓Build modern, composable, and accessible React UI components following the components.build specification. Use when creating, reviewing, or refactoring component libraries, design systems, or any reusable UI components. Triggers on tasks involving component APIs, composition patterns, accessibility, styling systems, or TypeScript props.
Installation
SKILL.md
Comprehensive guidelines for building modern, composable, and accessible UI components. Contains 16 rule categories covering everything from core principles to distribution, co-authored by Hayden Bleasel and shadcn.
| 1 | Overview | Specification scope and goals | overview | | 2 | Principles | Core design philosophy | principles | | 3 | Definitions | Common terminology | definitions | | 4 | Composition | Breaking down complex components | composition | | 5 | Accessibility | Keyboard, screen readers, ARIA | accessibility |
| 6 | State | Controlled/uncontrolled patterns | state | | 7 | Types | TypeScript props and interfaces | types | | 8 | Polymorphism | Element switching with as prop | polymorphism | | 9 | As-Child | Radix Slot composition pattern | as-child | | 10 | Data Attributes | data-state and data-slot | data-attributes |
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/nolly-studio/components-build-skill --skill components-build- Category
- *Creative Media
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is components-build?
Build modern, composable, and accessible React UI components following the components.build specification. Use when creating, reviewing, or refactoring component libraries, design systems, or any reusable UI components. Triggers on tasks involving component APIs, composition patterns, accessibility, styling systems, or TypeScript props. Source: nolly-studio/components-build-skill.
How do I install components-build?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/nolly-studio/components-build-skill --skill components-build Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/nolly-studio/components-build-skill
Details
- Category
- *Creative Media
- Source
- skills.sh
- First Seen
- 2026-02-01