Back to Plugins
React Figma

React Figma

<p>👀 Are you facing these problems?</p><p>A new (even existing) team member:</p><p>✅ Scenario 1: He starts looking at your product design on Figma and asks "I wonder which React component has been made for this UI part?"</p><p>✅ Scenario 2: He looks at a React component in your source code and wondering "where is it component being used on the actual Figma design?"</p><p><br></p><p>React Figma plugin helps you solve these problems, letting you manage your relationship between UI and Code. Not only that, it also helps you generate React Component code based on your Figma design.</p><p><br></p><p>Features:</p><p>- Component index</p><p>- Define component</p><p>- Generate React component code</p><p>- Generate React storybook (NEW)</p><p><br></p><p>TODO:</p><p>- Make storybook code generation optional</p><p>- Add support for TypeScript</p>

toolcssreactjshtmlfigmareactdevelopercodegeneratecomponentsdevelopment

Plugin Preview

React Figma preview

About this plugin

👀 Are you facing these problems?

A new (even existing) team member:

✅ Scenario 1: He starts looking at your product design on Figma and asks "I wonder which React component has been made for this UI part?"

✅ Scenario 2: He looks at a React component in your source code and wondering "where is it component being used on the actual Figma design?"


React Figma plugin helps you solve these problems, letting you manage your relationship between UI and Code. Not only that, it also helps you generate React Component code based on your Figma design.


Features:

- Component index

- Define component

- Generate React component code

- Generate React storybook (NEW)


TODO:

- Make storybook code generation optional

- Add support for TypeScript

Plugin Details

Version7
CreatedJune 15, 2020
Last UpdatedMarch 1, 2021
CategorySoftware development
CreatorThinh Pham
Stats10374 installs, 251 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/ui.html
  • main:dist/code.js