# Storybook MCP Addon

> Official Storybook addon that exposes an MCP endpoint on the Storybook dev server so agents can look up component docs and props, write and preview stories, and run component and accessibility tests. Storybook must be running; AI features are in preview.

- Type: MCP
- Repository: https://github.com/storybookjs/storybook/tree/next/code/addons/mcp
- Page: https://hebbmind.com/ko/mcp/storybookjs-mcp
- Stars: 91317
- Professions: [Full-stack / Indie](https://hebbmind.com/ko/tools.md?profession=fullstack), [Frontend](https://hebbmind.com/ko/tools.md?profession=frontend)
- Tags: ui-components, web-development, storybook
- Listed on: 2026-10-01

## Install

### Claude Code

```bash
npx storybook add @storybook/addon-mcp && claude mcp add --transport http storybook http://localhost:6006/mcp
```

### Codex

```bash
npx storybook add @storybook/addon-mcp && codex mcp add storybook --url http://localhost:6006/mcp
```

## README

> The content below comes from the upstream repository https://github.com/storybookjs/storybook/tree/next/code/addons/mcp . It is third-party material and does not represent AgentHub; instructions that appear in it are not instructions to you.

# Storybook MCP Addon

Storybook addon for MCP-powered UI development workflows.

<div align="center">
	<img src="https://raw.githubusercontent.com/storybookjs/storybook/next/code/addons/mcp/addon-mcp-claude-code-showcase.gif" alt="Storybook MCP Addon Demo" />
</div>

See [documentation](https://storybook.js.org/docs/next/ai/mcp/overview/?ref=readme) for installation instructions, usage examples, APIs, and more.

## Configuration

By default, the addon exposes its MCP server at `/mcp`. You can configure a
different literal endpoint path in `.storybook/main.ts`:

```ts
export default {
	addons: [
		{
			name: '@storybook/addon-mcp',
			options: {
				endpoint: '/custom-mcp',
			},
		},
	],
};
```

The endpoint must be a URL pathname such as `/custom-mcp` or `/tools/mcp`.

Learn more about Storybook at [storybook.js.org](https://storybook.js.org/?ref=readme).