Storybook MCP
A universal MCP server that connects to any Storybook site and extracts documentation in real-time using Playwright. Use it with any AI or client that supports MCP (Model Context Protocol)—Cursor, Claude Desktop, Windsurf, or other MCP hosts.
Storybook MCP
A universal MCP server that connects to any Storybook site and extracts documentation in real-time using Playwright.
Use it with any AI or client that supports MCP (Model Context Protocol)—Cursor, Claude Desktop, Windsurf, or other MCP hosts.
Features
- Works with any Storybook - Auto-detects format and version
- Live browsing - Real-time Playwright-based extraction
- Auto-detection - Detects Storybook format automatically
- Single file - Just
index.js, no build step
MCP Configuration
Cursor — one-click install
Using npx (recommended)
Add to your MCP client config (e.g. Cursor: ~/.cursor/mcp.json or Settings → MCP; Claude: claude_desktop_config.json; etc.):
{
"mcpServers": {
"storybook-mcp": {
"command": "npx",
"args": ["-y", "@raksbisht/storybook-mcp"]
}
}
}
With a default Storybook URL (optional):
{
"mcpServers": {
"storybook-mcp": {
"command": "npx",
"args": ["-y", "@raksbisht/storybook-mcp"],
"env": {
"STORYBOOK_URL": "https://your-storybook.com"
}
}
}
}
From source (development)
git clone https://github.com/raksbisht/storybook-mcp.git
cd storybook-mcp
npm install
Then in your MCP config:
{
"mcpServers": {
"storybook-mcp": {
"command": "node",
"args": ["/path/to/storybook-mcp/index.js"]
}
}
}
Available Tools
| Tool | Description |
|---|---|
connect | Connect to a Storybook URL and get connection status. Required before other tools. |
list | List components and stories in the navigation. Optional: category, full (hierarchy). |
search | Search for components by name or path. Required: query. |
get_docs | Get documentation, code examples, and content for a component or story. Required: path. Optional: full, format (markdown/structured). |
screenshot | Take a screenshot of a component or story. Required: path. |
Example
1. connect({ url: "https://storybook.js.org" })
2. search({ query: "button" })
3. get_docs({ path: "components-button--basic" })
Compatibility
Works with common Storybook deployments (various URL formats and index.json-based setups).
License
MIT
Verwandte Server
Scout Monitoring MCP
SponsorPut performance and error data directly in the hands of your AI assistant.
Alpha Vantage MCP Server
SponsorAccess financial market data: realtime & historical stock, ETF, options, forex, crypto, commodities, fundamentals, technical indicators, & more
All-in-MCP
Provides utility functions for common tasks like text processing, encoding, decoding, hashing, and system information.
gNMIBuddy
Retrieves essential network information from devices using gNMI and OpenConfig models.
Lettr MCP
MCP for Lettr transactional email API
WinCC Unified MCP Server
An MCP server for interfacing with SIEMENS WinCC Unified SCADA systems via their GraphQL API.
Unity MCP
Perform actions in the Unity Editor for game development using AI clients.
Claude Code Buddy (CCB)
Add persistent project memory and smart task routing to Claude Code. Stop repeating context every session - Claude finally remembers your architecture, decisions, and patterns forever. 100% local, 17 MCP tools.
Godot MCP Pro
Premium MCP server for Godot game engine with 84 AI-powered tools for scene editing, scripting, animation, tilemap, shader, input simulation, and runtime debugging.
Replicate Recraft V3
Generate high-quality images using the Recraft V3 model via the Replicate API.
Ghost MCP
An MCP server for the Ghost blogging platform with Server-Sent Events (SSE) transport support.
mcp-registry-mcp
Interact with an MCP registry to check health, list entries, and get server details.