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
Serveurs connexes
Alpha Vantage MCP Server
sponsorAccess financial market data: realtime & historical stock, ETF, options, forex, crypto, commodities, fundamentals, technical indicators, & more
Remote MCP Server on Cloudflare (Authless)
An example of a remote MCP server deployable on Cloudflare Workers without authentication, featuring customizable tools.
DeepADB
The deepest Android Debug Bridge MCP server — 147 tools from UI to baseband.
NeoCoder
Enables AI assistants to use a Neo4j knowledge graph for standardized coding workflows, acting as a dynamic instruction manual and project memory.
Adios MCP
A remote MCP server deployable on Cloudflare Workers without authentication.
FastMCP ThreatIntel
An AI-powered threat intelligence analysis tool for multi-source IOC analysis, APT attribution, and interactive reporting.
MCP Manager
An interactive CLI tool for managing MCP server configurations in the current directory.
.NET Types Explorer
Provides detailed type information from .NET projects including assembly exploration, type reflection, and NuGet integration for AI coding agents
MegaChad
Burn-to-create looksmaxxing engine on MegaETH with 14 MCP tools for swap quotes, token stats, NFT minting, gallery, leaderboard, wallet checks, gasless burns, and orchestrated agent flows
OpenAPI to MCP Server
A tool to create MCP servers from OpenAPI/Swagger specifications, allowing AI assistants to interact with your APIs.
Code Sync MCP Server
Hot reload remote containerized Python applications directly from your IDE.