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
相關伺服器
Scout Monitoring MCP
贊助Put performance and error data directly in the hands of your AI assistant.
Alpha Vantage MCP Server
贊助Access financial market data: realtime & historical stock, ETF, options, forex, crypto, commodities, fundamentals, technical indicators, & more
MCP-Typescribe
Answers questions about TypeScript APIs using TypeDoc JSON documentation.
Translator AI
Translate JSON i18n files using Google Gemini or local Ollama models, with incremental caching support.
Unreal Engine Code Analyzer
Analyzes Unreal Engine source code to provide context for AI assistants.
MCP Server Automation CLI
A command-line tool to automate the deployment of MCP servers to AWS ECS.
Galley MCP Server
Integrates Galley's GraphQL API with MCP clients. It automatically introspects the GraphQL schema for seamless use with tools like Claude and VS Code.
SwarmTask
An asynchronous task manager for parallel execution of shell commands with real-time progress monitoring.
MCP-Creator-MCP
Create new MCP servers using AI-guided workflows and intelligent templates.
Limetest
A lightweight, AI-powered end-to-end testing framework for CI workflows. Requires an OpenAI API key.
Command-Line MCP Server
A secure MCP server for executing terminal commands with controlled directory access and command permissions.
AI Agent Playwright
An AI agent for the Playwright MCP server, enabling automated web testing and interaction.