Extract reusable UI components and design tokens into a design system.
npx skills add https://github.com/ChoonwooLim/SodamFN --skill extract-choonwoolim
Please help me install this Agent Skill. Skill: extract Source: https://github.com/ChoonwooLim/SodamFN/tree/main/.claude/skills/extract Command: npx skills add https://github.com/ChoonwooLim/SodamFN --skill extract-choonwoolim
Identifies and consolidates repeated UI patterns, components, and design tokens to reduce duplication and improve consistency across a design system.
Run the extract skill against your design system repository to identify and consolidate reusable components and tokens.
High-intent search queries and answers about installing and using this skill.
Extracting design tokens involves identifying hard-coded values in your UI and converting them into semantic naming structures. This process reduces duplication and ensures consistent styling across shared components and projects.
Consolidating UI patterns requires detecting repeated layout structures and component opportunities, then refactoring them into shared components with accessible props and clear variants to ensure systematic reuse across your design system.
Pattern discovery for design system refactoring works by scanning your repository to detect repeated components, layout patterns, and token opportunities. These identified patterns are then extracted and consolidated to reduce duplication and improve consistency.
Yes, you can create semantic design tokens from hard-coded values by identifying repeated styling values across your UI library and converting them into systematically named tokens to enable consistent design system refactoring and sharing.
Extracting shared components requires a UI repository to analyze for repeated patterns. The skill improves an existing design system by identifying reusable components, tokens, and patterns, then consolidating them for systematic reuse across projects.
riabtsevExtract reusable UI components and design tokens into a TypeScript design system.
kazdencExtract reusable UI components, design tokens, and patterns into a design system.
resendConsolidate UI development with design tokens and component primitives.
nattergabrielIdentify reusable UI patterns, tokens, and components for design system consolidation.
