story.to.design
  • Features
  • Pricing
  • Docs
  • Blog
  • Discord Logo
  • Twitter Logo
  • Mail Logo
  • Features
  • Pricing
  • Docs
  • Blog
  • Discord Logo
  • Twitter Logo
  • Mail Logo
  • Getting started
    • What is story.to.design?
    • Our vision
    • Basic concepts and definitions
    • Incorporate it in your workflow
    • Compatibility
  • Set up Storybook
    • Connect your Storybook
    • Connect a private Storybook
    • How to write stories
    • Extend stories with Figma variants
    • Developer Mode
  • Import components and variants
    • Import your first component
    • Understand a component's status
    • Set up variants - Basic
    • Set up variants - Advanced
    • Simulated states
    • Documentation of variants
    • Prototype with components
    • Generate subcomponents
  • Keep Figma in sync with code
    • Bring in story updates
  • Reference
    • Storybook args
    • variantProperties API
  • Troubleshooting
    • Report an issue
    • Missing fonts
    • No Args found
    • No supported Args found
    • Storybook variants misrendered
  • Downloads
    • Agent
    • Figma plugin
  • Contact us
    • Send us an email
    • Message on Discord
    • Tweet @story_to_design
  • Getting started
    • What is story.to.design?
    • Our vision
    • Basic concepts and definitions
    • Incorporate it in your workflow
    • Compatibility
  • Set up Storybook
    • Connect your Storybook
    • Connect a private Storybook
    • How to write stories
    • Extend stories with Figma variants
    • Developer Mode
  • Import components and variants
    • Import your first component
    • Understand a component's status
    • Set up variants - Basic
    • Set up variants - Advanced
    • Simulated states
    • Documentation of variants
    • Prototype with components
    • Generate subcomponents
  • Keep Figma in sync with code
    • Bring in story updates
  • Reference
    • Storybook args
    • variantProperties API
  • Troubleshooting
    • Report an issue
    • Missing fonts
    • No Args found
    • No supported Args found
    • Storybook variants misrendered
  • Downloads
    • Agent
    • Figma plugin
  • Contact us
    • Send us an email
    • Message on Discord
    • Tweet @story_to_design

Documentation of variants

When you import your component from Storybook to Figma with story.to.design, we also generate any documentation for that component that was created in Storybook, Backlight or Histoire, as well as all links related to this component.

Example of imported variants on the canvas with Storybook/Backlight links

Previous page

Simulated states

Next page

Prototype with components

On this page

  • Overview
story.to.design logo story.to.design
  • Discord logo
  • Twitter logo
  • Youtube logo
  • Email icon
  • Features
  • Pricing
  • Docs
  • Blog
story.to.design - Keep your Figma components up to date with code | Product Hunt
story.to.design © 2022-2023 | All rights reserved
Brought to you by ‹div›RIOTS logo
  • Terms & Conditions
  • Privacy Policy