Storybook-to-Figma

Import Storybook components from Chromatic directly into Figma as editable layers

Plugin Preview

Storybook to Figma lets you import your Storybook components hosted on Chromatic directly into Figma as fully editable vector layers.

✨ Features:

• Browse all stories from your Chromatic Storybook

• Select multiple components at once

• Batch import with parallel processing for speed

• Components are imported as editable Figma layers (not images)

• Support for private projects with token authentication

• Search and filter components easily

🚀 How to use:

1. Enter your Chromatic Storybook URL

2. Click "Load Stories" to browse components

3. Select the components you want

4. Click "Import Selected" - done!

Perfect for designers who want to use real components from their design system in Figma mockups.

Note: Currently supports Chromatic-hosted Storybooks only.

API:1.0.0
UI:ui.html
main:dist/code.js
Document Access:dynamic-page
Editor Types:
figma
Allowed Domains:
- https://*.chromatic.com
- https://9ujrz4tc79.execute-api.ap-northeast-2.amazonaws.com