mcp design system extractor for Claude Code

io.github.freema/mcp-design-system-extractor

MCP server for Storybook design systems — extract component HTML, styles and metadata.

client:Claude Code transport:stdio runtime:npm

Install mcp design system extractor in Claude Code

run in your project directory

claude mcp add mcp-design-system-extractor -e STORYBOOK_URL=<STORYBOOK_URL> -e NODE_TLS_REJECT_UNAUTHORIZED=<NODE_TLS_REJECT_UNAUTHORIZED> -e DEBUG=<DEBUG> -- npx -y mcp-design-system-extractor

Adds it for this project only. Append --scope user to make it available everywhere. Claude Code docs

mcp design system extractor in other clients

Claude Desktop
Cursor
VS Code
Zed
Windsurf
Cline
Gemini CLI
Grok
LangChain

mcp design system extractor MCP server