Skills and an MCP server for Storybook, the tool for building, documenting, and testing UI components in isolation. Covers canary releases, docs review, PR comment handling, lint and type fixes, and QA labels.
Claude Code
> /plugin marketplace add storybookjs/storybook> /plugin install storybook@storybook
Codex
$ npx skills add storybookjs/storybook -a codex
Cursor
$ npx skills add storybookjs/storybook -a cursor
Gemini CLI
$ npx skills add storybookjs/storybook -a gemini-cli
GitHub Copilot
$ copilot plugin marketplace add storybookjs/storybook$ copilot plugin install storybook@storybook
OpenCode
$ npx skills add storybookjs/storybook -a opencode
Windsurf
$ npx skills add storybookjs/storybook -a windsurf
Storybook is a frontend workshop for building UI components and pages in isolation. Thousands of teams use it for UI development, testing, and documentation. Find out more at storybook.js.org!
View README for:
Visit Storybook's website to learn more about Storybook and to get started.
Documentation can be found on Storybook's docs site.
View Component Encyclopedia to see how leading teams use Storybook.
Use storybook.new to quickly create an example project in Stackblitz.
Storybook comes with a lot of addons for component design, documentation, testing, interactivity, and so on. Storybook's API makes it possible to configure and extend in various ways. It has even been extended to support React Native, Android, iOS, and Flutter development for mobile.
For additional help, share your issue in the repo's GitHub Discussions.
| Renderer | Demo | |
|---|---|---|
| React |  |  |
| Angular |  |  |
| Vue 3 |  |  |
| Web components |  |  |
| React Native |  |  |
| HTML |  |  |
| Ember |  |  |
| Svelte |  |  |
| Preact |  |  |
| Qwik |  |  |
| SolidJS |  |  |
| Android, iOS, Flutter |  |  |
| Addons | |
|---|---|
| a11y | Test components for user accessibility in Storybook |
| actions | Log actions as users interact with components in the Storybook UI |
| backgrounds | Let users choose backgrounds in the Storybook UI |
| cssresources | Dynamically add/remove CSS resources to the component iframe |
| design assets | View images, videos, and weblinks alongside your story |
| docs | Add high quality documentation to your components |
| events | Interactively fire events to components that respond to EventEmitter |
| google-analytics | Reports google analytics on stories |
| graphql | Query a GraphQL server within Storybook stories |
| jest | View the results of components' unit tests in Storybook |
Stars on GitHub
View @storybookjs’s profileLets you design and develop individual React Native components in isolation, without running your whole app. Helps set up Storybook, write component stories, and upgrade between Storybook versions.
@storybookjsSkills for Next.js developers covering bundle size reduction, Cache Components and Partial Prefetching adoption, and verifying runtime behavior in a running app after code edits.
@vercelHelps you add, find, fix, style and compose shadcn UI components in your React project, with component docs and usage examples. It can also move a project from Radix UI primitives to Base UI.
@shadcn-uielectron: Build cross-platform desktop apps with JavaScript, HTML, and CSS.
@electronGives coding agents a design direction, reference images and a browser check, so the websites and app screens they build look deliberate instead of like a generic template page.
@leonxlnxInstall it with the command on its page. It includes component-docs, storybook-init, storybook-setup. Its skills do not fire on their own yet. Free and open source.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it
