Storybook Connect
Inspect Storybook stories in Figma
Plugin Preview
About this plugin
Embed stories into your Figma workspace to cross-reference the live implementation in one place. Open the Storybook Connect window to start interacting with the real components.With the Storybook Connect Plugin you can: Link design components to stories Play with interactive stories in Figma Compare implementation to the designLink componentsWhen you link a component or a variant to a story that link propagates to every instance in Figma. Your collaborators can also see the story link.Compare implementation to the designThe plugin comes with a compact yet powerful story embed that includes familiar tools like the Outline, Measure, Backgrounds, and more.Open Storybook from the sidebarSee which components are linked by glancing at the Storybook Connect section in Figma’s sidebar.Open Storybook in Dev modeSee which components are linked by glancing at the Storybook Connect section in Figma’s sidebarRequires a Chromatic account for access control & security, sign up for free here.Join the Storybook discord here and visit the #figma-plugin channel for support!
Plugin Details
| Version | 28 |
|---|---|
| Created | December 24, 2021 |
| Last Updated | June 23, 2025 |
| Category | Software development |
| Creator | Chromatic Deploys |
| Stats | 9623 installs, 1005 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/ui.html
- main:dist/code.js
- Editor Types:figma
- Allowed Domains:
- https://*.chromatic.com
More Like This
Discover other plugins in the Software development category.
Figma to Code (HTML, Tailwind, Flutter, SwiftUI)
Code Conversion Made Easy: Figma to Web & Apps
Builder.io - Figma to Code & AI Apps (React, Vue, Tailwind, etc)
Export designs to clean, responsive code or turn Figma screens into AI apps and prototypes.
SkewDat
Skew any layer or group with all layers preserved to edit.