Extract reusable components and design tokens into a design system.
npx skills add https://github.com/LinCie/bearuang --skill extract-lincie
Please help me install this Agent Skill. Skill: extract Source: https://github.com/LinCie/bearuang/tree/main/.agents/skills/extract Command: npx skills add https://github.com/LinCie/bearuang --skill extract-lincie
High-intent search queries and answers about installing and using this skill.
Identify UI patterns used three or more times, then create shared components with clear props APIs, variants, and accessibility support. Replace each existing usage with the shared version and delete the old implementations.
Scan for repeated colors, spacing, typography, and shadow values, then create semantically named tokens organized by primitive and semantic hierarchy. Document when to use each token rather than creating tokens for every value.
Avoid extracting one-off, context-specific implementations or patterns used fewer than three times. Overly generic components and tokens without semantic meaning add maintenance cost without improving consistency.
The Skill asks before creating one, since location and structure matter. Confirm the preferred directory, naming conventions, and documentation patterns first, then grow the system incrementally with clearly reusable patterns.
Search for all instances of the extracted pattern, update each use to consume the shared version, and verify visual and functional parity. Remove the old implementations once migration is complete.
FairladyZ625Extract reusable components, design tokens, and UI patterns into a centralized design system.
redpanda-dataEnforces TypeScript, React, and JavaScript best practices using Ultracite and Biome rules.
hohai99Compare current changes against a baseline to detect regressions.
SayBGMImplement and customize shadcn/ui components in React with Tailwind CSS.
