Storybook MCP Server

What is Storybook MCP?

Storybook MCP is a Model Context Protocol server that exposes UI component information and development workflows from Storybook, enabling AI agents to work more efficiently with component libraries. It is available as a standalone library (@storybook/mcp) or as a Storybook addon (@storybook/addon-mcp) that runs the MCP server within your existing Storybook dev server.

How to use Storybook MCP?

Install @storybook/mcp as a standalone server, or add @storybook/addon-mcp to your Storybook setup. When using the addon, the MCP server is automatically available at http://localhost:6006/mcp while Storybook is running. Connect your AI agent (e.g., a coding assistant) to that endpoint. For the standalone server, the default address is http://localhost:13316/mcp. Use the MCP Inspector (pnpm inspect) or curl to test the server.

Key features of Storybook MCP

• Exposes UI component metadata via MCP protocol
• Provides tools for exploring component stories and properties
• Integrates directly into a running Storybook dev server
• Can be run as a standalone server independent of Storybook
• Supports debugging with MCP Inspector and curl

Use cases of Storybook MCP

• AI coding assistants retrieving component documentation while building UIs
• Automated agents exploring available UI components and their variants
• AI-powered testing or visual regression workflows using Storybook data
• Integrating an AI chat interface with a design system’s component library