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
Alpha Vantage MCP Server
SponsorAccess financial market data: realtime & historical stock, ETF, options, forex, crypto, commodities, fundamentals, technical indicators, & more
Windows CLI
Interact with Windows command-line interfaces like PowerShell, CMD, Git Bash, and WSL.
ALTER Identity
Identity infrastructure for the AI economy. 33-trait psychometric engine — belonging probability, trait vectors, attunement depth. Remote streamable-HTTP. Free tier: 16 tools, 10 req/min.
A11y MCP Server
Perform accessibility audits on webpages using the axe-core engine to identify and help fix a11y issues.
Celery Flower MCP
MCP server for Celery Flower — monitor workers, manage tasks and queues from any AI assistant
Markdown Sidecar MCP Server
An MCP server to access markdown documentation for locally installed NPM, Go, and PyPi packages.
Alertmanager
MCP to interact with Alertmanager - observability alerts management tool
ADB Friend
A CLI tool for developers to manage Android devices via ADB.
Webhook Tester MCP Server
Interact with webhook-test.com to automate and manage webhook tokens, inspect incoming requests, and perform analytics.
GitGuardian
Scan projects for over 500 types of secrets using GitGuardian's API to prevent credential leaks.
GitHub Issue Reproduction MCP Server
An intelligent MCP server that automates the reproduction of GitHub issues for AWS CDK projects.