extract
From the author
Identifies reusable UI patterns, components, and design tokens, then extracts and consolidates them into a design system for systematic reuse.
Install
npx skills add skillmds/skillmd --skill extract -a claude-code
Installs to .claude/skills/extract/ · Each command fetches the skill straight from GitHub with the open skills CLI.
Download .zip
Byte-identical to the scanned commit, with the repository’s licence and a SOURCE.txt.
Want your agent to suggest skills while you type? See how to use skills from your IDE.
Safety checks on SKILL.md
No warnings.
Why 84
Security100
Provenance67
Maintenance100
Licence100
Adoption39
aiqbench computes the trust score from public signals. It is not a security audit, so read a skill before you install it.
Similar skills
Closest to this one by what they do and when they are used.
- extract-design-systemarvindrk/extract-design-systemExtract design primitives from a public website and generate starter token files for your project.Design★ 253
- ui-design-systemmajiayu000/spellbookUse when creating or maintaining UI design systems, design tokens, component documentation, responsive calculations, quality checks, or design-dev handoff materials.Design★ 288
- design-system-startersoftaworks/agent-toolkitCreate and evolve design systems with design tokens, component architecture, accessibility guidelines, and documentation templates. Ensures consistent, scalable, and accessible UI across products.Design★ 2.6K
- design-systemanthropics/knowledge-work-pluginsAudit, document, or extend your design system. Use when checking for naming inconsistencies or hardcoded values across components, writing documentation for a component's variants, states, and accessibility notes, or designing a new pattern that fits the existing system.OfficialDesign★ 32.5K
- designlang-tokensManavarya09/design-extractUse when styling UI for retool.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.Design★ 4.4K
- extract-designManavarya09/design-extractExtract the full design language from any website URL. Produces 8 output files including AI-optimized markdown, visual HTML preview, Tailwind config, React theme, shadcn/ui theme, Figma variables, W3C design tokens, and CSS variables. Also runs WCAG accessibility scoring. Use when user says 'extract design', 'get design system', 'design language', 'design tokens', 'what colors/fonts does this site use', 'turn this URL into design tokens', 'make a Tailwind theme from this site', or '/extract-design'. Do not use for building a new UI from scratch unless the user first wants to extract an existing website's design language.Design★ 4.4K
Ratings & reviews
—
no reviews
Tried this skill? Rate it to help others. Sign in
Discussion
Join the discussion. Sign in