Home / Skills / extract-design
extract-design
Extract 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
- License
- MIT
- SKILL.md tokens
- 835
- Bundled files
- 0
- Bundled tokens (estimated)
- 0
Cost per 1,000 loads
Estimated input cost per 1,000 loads of SKILL.md only (characters ÷ 4). Bundled files, output tokens and execution are excluded.
| Model | Input / 1M tokens | 1,000 loads |
|---|---|---|
| Claude Opus 5 | $5.00 | $4.17 |
| Claude Sonnet 5 | $2.00 | $1.67 |
| Claude Haiku 4.5 | $1.00 | $0.83 |
Safety flags
Detected automatically from files; not a security audit.
- Runs scripts
- No
- Network access
- Yes
- Shell commands
- Yes
Works with
Open SKILL.md format
- Claude Code
- Codex
- Cursor
- GitHub Copilot
- Gemini CLI
- OpenCode
- Goose
Install
npx skills add Manavarya09/design-extract --skill extract-designLast verified:
extract-design FAQ
What does the extract-design skill do?
Extract 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 Source: https://github.com/Manavarya09/design-extract/blob/main/skills/extract-design/SKILL.md
What does the extract-design skill cost to load?
SKILL.md is about 835 tokens. Estimated input cost per 1,000 loads: Claude Opus 5 $4.17; Claude Sonnet 5 $1.67; Claude Haiku 4.5 $0.83. Estimated input cost per 1,000 loads of SKILL.md only (characters ÷ 4). Bundled files, output tokens and execution are excluded. Prices: https://docs.anthropic.com/en/docs/about-claude/pricing
How do I install the extract-design skill?
Skills CLI: npx skills add Manavarya09/design-extract --skill extract-design. Download the extract-design skill folder as a ZIP and upload it in Claude.ai skills settings.
Is the extract-design skill safe?
Automatically detected flags: network access, shell commands. Flags are detected automatically from the skill's files and are not a security audit; review the SKILL.md before installing.