Best Storybook MCP Servers
Storybook is an open source tool for building UI components and pages in isolation. It streamlines UI development, testing, and documentation.
Why this server?
Allows scaffolding Storybook documentation alongside React components.
AlicenseAqualityAmaintenanceLets AI agents scaffold modern npm packages, CLIs, HTTP services, and apps as a native tool. Three tools: inspect the full option/preset schema, preview the generated file tree for a config, and write the project to disk.38381MITWhy this server?
Extracts component information from Storybook design systems, including HTML, styles, component metadata, props documentation, theme information, and relationships between components.
AlicenseAqualityBmaintenanceServer that enables AI assistants to interact with Storybook design systems. Extract component HTML, analyze styles, and help with design system adoption and refactoring.97869MITWhy this server?
Planned integration to auto-generate Storybook stories for existing components.
AlicenseAqualityCmaintenance9 MCP servers for React + TypeScript development automation — component scaffolding, dependency auditing, WCAG accessibility checking, test generation, TypeScript enforcement, and monorepo management. 134 tests, CI on Node 20+22.7833MITWhy this server?
Supports upgrading Storybook, including dependency analysis, breaking change detection, and safe migration steps.
AlicenseBqualityDmaintenanceEnables AI agents to safely upgrade JavaScript and TypeScript projects through dependency analysis, upgrade path detection, breaking change identification, codemod application, and PR summary generation.1428MITWhy this server?
Provides tools for extracting component lists, props information, and custom data from Storybook documentation, enabling AI to understand and reference UI component libraries.
AlicenseBqualityBmaintenanceA Model Context Protocol (MCP) server for Storybook.290846MITWhy this server?
Auto-syncs token and component changes to Storybook documentation, ensuring design system docs stay up-to-date without manual rebuilding.
AlicenseBqualityAmaintenanceEnables AI agents to access design system tokens and component contracts through MCP, reducing token usage and ensuring consistency.29MITWhy this server?
Provides live preview of Storybook components directly in the IDE, allowing AI agents to view component renders as they edit.
AlicenseAqualityDmaintenanceEnables live preview of Storybook components inside the IDE as the AI edits them, using MCP Apps integration.1121MITWhy this server?
Provides an MCP server that integrates with Storybook, allowing AI tools to query available UI components, retrieve component information and usage examples to help implement UI from design specifications.
AlicenseBqualityDmaintenanceA Model Context Protocol server that integrates with Storybook to help AI tools query UI components and retrieve usage examples from static Storybook files.290821MITWhy this server?
Generates Storybook stories for web components based on the Custom Elements Manifest, enabling automated story creation and documentation within Storybook.
AlicenseAqualityCmaintenanceMCP server that provides AI agents with accurate, hallucination-free access to web component APIs by reading the library's Custom Elements Manifest.79245MIT