Skip to content
mcp/skillhub

Agent Skill

Extract Design System skill

extract-design-systemarvindrk/extract-design-systemskills/extract-design-system/SKILL.md

Extract design primitives from a public website and generate starter token files for your project.

250MIT

always on

20 tokname + description

once used

394 tokSKILL.md body

bundled files

21 KB

installs

130kskills.sh

Install the Extract Design System skill

Skills CLI (Claude Code, Codex, Cursor and others)

npx skills add https://github.com/arvindrk/extract-design-system --skill extract-design-system

Claude Code, by hand (all projects)

git clone --depth 1 https://github.com/arvindrk/extract-design-system.git /tmp/extract-design-system
mkdir -p ~/.claude/skills
cp -R /tmp/extract-design-system/skills/extract-design-system ~/.claude/skills/extract-design-system

For one project only, copy the folder into .claude/skills/ in that project instead. The agent picks it up when a task matches its description.

What it costs your context

Agent Skills load in three steps. Tokens counted with the o200k tokenizer; your model's count will differ a little.

WhenWhat loadsCost
Every sessionName and description20 tok
When the agent uses itThe SKILL.md instructions394 tok
Only if opened2 bundled files (1 KB)varies

Until it is used, extract-design-system costs about 68× less than the median MCP server we measured (1,362 tokens on every turn). Skills vs MCP study

Checks

Our checks found nothing to flag: it follows the Agent Skills specification's naming and size guidelines and doesn't pipe downloads into a shell.

Checked 2026-10-22 · method

What's inside

The headings of its SKILL.md. Read the full file on GitHub.

  • Extract Design System
  • Before You Start
  • Workflow
  • Safety Boundaries