How do I install the Storybook skill?

Run npx skillmds@latest add dragoon0x/storybook in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Storybook safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Storybook?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Storybook free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Storybook?

dragoon0x (@dragoon0x) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Storybook

Name: Storybook
Author: dragoon0x

Scaffold storybook config (.storybook/main.ts, preview.ts) plus auto-generated *.stories.tsx files for every PascalCase component in the codebase that has a matching named export. Caps at 50 components per run. dragoon does NOT install storybook - run `npx storybook init` after. Use to bootstrap stories quickly across an existing component library. Run as `node ~/.claude/skills/dragoon/skills/storybook/scripts/storybook.js`.

dragoon0x e76a687 2 files · 4.4 KB Updated Sep 17, 2026

Web & Frontend

Install

Press C to copy

$ npx skillmds@latest add dragoon0x/storybook

Installs into ~/.claude/skills (or .claude/skills inside a project). Restart Claude Code to pick it up.

Download .zip

＋ Add to collection

README badge

[![SkillMD](https://skillmd.com/badge/dragoon0x/storybook.svg)](https://skillmd.com/skills/dragoon0x/storybook)

Trust & safety

Audits pending

Not yet audited · commit e76a687

Works with: Claude Code Claude.ai OpenAI Codex +

File contents

/storybook

Auto-generates a story for every component, plus storybook config.

When to use

Setting up storybook for the first time
Backfilling stories for an existing component library
The user says "add storybook", "scaffold stories"

Run it

dragoon storybook            # preview
dragoon storybook --apply    # write stories for every component

Then

npm i -D @storybook/react-vite @storybook/react @storybook/addon-essentials
npx storybook init
npm run storybook

Dragoon0x/dragoon-skills/tree/main/skills/storybook commit e76a687d65

Frequently asked questions

npx skillmds@latest add dragoon0x/storybook