HotStack

← Back to browse

mcp-design-system-extractor

Indexed by io.github.freema
View source ↗

About

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

Use this server

Add it to your MCP client. The catalogue lists this config verbatim from its source — it does not run, download, or vouch for the server. Review the command before you run it.

Transportstdio (runs a local command)
Env varsSTORYBOOK_URL NODE_TLS_REJECT_UNAUTHORIZED DEBUG
Claude Code 
claude mcp add --env STORYBOOK_URL= --env NODE_TLS_REJECT_UNAUTHORIZED= --env DEBUG= mcp-design-system-extractor -- npx mcp-design-system-extractor
Cursor

Add to Cursor

If the button doesn't open Cursor, use the JSON below — Cursor accepts the same mcpServers config.

VS Code 
code --add-mcp '{"name":"mcp-design-system-extractor","command":"npx","args":["mcp-design-system-extractor"],"env":{"STORYBOOK_URL":"","NODE_TLS_REJECT_UNAUTHORIZED":"","DEBUG":""}}'
JSON 
{
  "mcpServers": {
    "mcp-design-system-extractor": {
      "command": "npx",
      "args": [
        "mcp-design-system-extractor"
      ],
      "env": {
        "STORYBOOK_URL": "",
        "NODE_TLS_REJECT_UNAUTHORIZED": "",
        "DEBUG": ""
      }
    }
  }
}

Environment variables are listed by name only — fill in your own values. Entries never carry secrets.