--- title: Storybook MCP for AI-aware component libraries | daily.dev description: Storybook 10.3+ ships with `@storybook/addon-mcp`, which exposes your component library as a set of callable MCP tools that AI agents can query at runtime.... canonical: https://daily.dev/posts/storybook-mcp-for-ai-aware-component-libraries-cqjtrtq0r twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Storybook MCP for AI-aware component libraries | daily.dev og:description: Storybook 10.3+ ships with `@storybook/addon-mcp`, which exposes your component library as a set of callable MCP tools that AI agents can query at runtime.... og:url: https://daily.dev/posts/storybook-mcp-for-ai-aware-component-libraries-cqjtrtq0r og:image: https://api.daily.dev/og/posts/cQjtRtQ0R.png og:image:alt: Storybook MCP for AI-aware component libraries og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Storybook MCP for AI-aware component libraries **[LogRocket](https://daily.dev/sources/logrocket)** · 9 min read · 1 upvotes · 1 comments ## Summary Storybook 10.3+ ships with `@storybook/addon-mcp`, which exposes your component library as a set of callable MCP tools that AI agents can query at runtime. Instead of hallucinating component APIs from training data, agents can call `list-all-documentation`, `get-documentation`, and `run-story-tests` to discover components, read their exact prop contracts, and verify generated code against real tests. A side-by-side demo shows an agent without MCP producing 263 lines of bespoke inline HTML ignoring the design system, while the same agent with MCP makes six tool calls first, then writes 188 lines that correctly import and compose existing components. The testing loop also enables self-healing: when story tests failed due to missing `htmlFor`/`id` linkage in a shared TextInput component, the agent autonomously applied the accessibility fix, benefiting every story that uses that component. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Community discussion Top comments from developers on daily.dev. **@yaireo** · 0 upvotes > You still need to have a detailed Storybook for every component. This is nice but anyway I have a SKILL file mentioning all the components (which are meant to be reusable) and briefly explain them so the AI will know and pick optimal one for the task. I update this SKILL when needed. ## Similar posts on daily.dev - [Storybook MCP sneak peek](https://daily.dev/posts/storybook-mcp-sneak-peek-9gnahslhl) · Storybook · 96 upvotes · 1 comments - [Storybook MCP for React](https://daily.dev/posts/storybook-mcp-for-react-x35ultaaf) · Storybook · 104 upvotes · 4 comments --- Tags: [#react](https://daily.dev/tags/react), [#ai-agents](https://daily.dev/tags/ai-agents), [#mcp](https://daily.dev/tags/mcp), [#storybook](https://daily.dev/tags/storybook) [View this post on daily.dev](https://daily.dev/posts/storybook-mcp-for-ai-aware-component-libraries-cqjtrtq0r) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"Storybook MCP for AI-aware component libraries","url":"https://daily.dev/posts/storybook-mcp-for-ai-aware-component-libraries-cqjtrtq0r","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/storybook-mcp-for-ai-aware-component-libraries-cqjtrtq0r"},"datePublished":"2026-07-07T10:58:24.675Z","dateModified":"2026-07-07T14:22:08.808Z","description":"Storybook 10.3+ ships with `@storybook/addon-mcp`, which exposes your component library as a set of callable MCP tools that AI agents can query at runtime....","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/4cbd179d59551544e66441546e798e92?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/4cbd179d59551544e66441546e798e92?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"LogRocket","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"LogRocket","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/logrocket","url":"https://daily.dev/sources/logrocket"},"commentCount":1,"discussionUrl":"https://daily.dev/posts/storybook-mcp-for-ai-aware-component-libraries-cqjtrtq0r","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":1}],"keywords":"react,ai-agents,mcp,storybook","timeRequired":"PT9M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"LogRocket","item":"https://daily.dev/sources/logrocket"},{"@type":"ListItem","position":3,"name":"Storybook MCP for AI-aware component libraries"}]} {"@context":"https://schema.org","@type":"WebPage","@id":"https://daily.dev/posts/storybook-mcp-for-ai-aware-component-libraries-cqjtrtq0r","comment":[{"@type":"Comment","text":"You still need to have a detailed Storybook for every component. This is nice but anyway I have a SKILL file mentioning all the components (which are meant to be reusable) and briefly explain them so the AI will know and pick optimal one for the task. I update this SKILL when needed.","datePublished":"2026-07-08T08:20:51.293Z","url":"https://daily.dev/posts/cQjtRtQ0R#c-szTZhuhjC","author":{"@type":"Person","name":"Yair Even Or","url":"https://daily.dev/yaireo","image":"https://avatars.githubusercontent.com/u/845031?v=4"}}]} ```