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 design Link components When 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 design The plugin comes with a compact yet powerful story embed that includes familiar tools like the Outline, Measure, Backgrounds, and more. Open Storybook from the sidebar See which components are linked by glancing at the Storybook Connect section in Figma’s sidebar. Open Storybook in Dev mode See which components are linked by glancing at the Storybook Connect section in Figma’s sidebar Requires 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!
Storybook Connect
开发 · 820 likes
Inspect Storybook stories in Figma
Related plugins
- Figma to Code (HTML, Tailwind, Flutter, SwiftUI)
Code Conversion Made Easy: Figma to Web & Apps
- Anima - Figma to Code React, HTML, CSS, Tailwind, MUI (DevMode Inspect React / HTML / Vue / CSS)
Anima - AI Powered Design to code
- Builder.io - AI-Powered Figma to Code (React, Vue, Tailwind, & more)
Export designs to responsive code (React, HTML, Vue, Tailwind, etc) with AI
- SkewDat
Skew any layer or group with all layers preserved to edit.
- Locofy Lightning - Figma to Code in a flash
Convert Figma designs to code in a flash - React, React Native, HTML, Angular, Next, Gatsby, Vue
- Figma to HTML with Framer
Convert your Figma design to HTML code in seconds with Framer.