Back to Plugins
Flock Figma to React Component

Flock Figma to React Component

Use Figma to generate React components in Flock style.

flockcode-generators

Plugin Preview

Flock Figma to React Component preview

About this plugin

Transform Figma Designs into React Code

Generate React code from your Figma designs with an opinionated format built around material UI and the Flock component library.


Usage

Switch to Dev mode and change the language under the Code section to Flock Figma to React Component to generate code. This tool will generate the code following the convention of div's being replaced with MUI boxes and components being replaced with components from '@flock/shared-ui'.


To use your own library, simply replace imports from '@flock/shared-ui' with your own component library.


If you want the plugin to replace instances of your component or your style definitions with their tokens, go to the Plugins panel in Dev Mode and run this plugin to set your Figma API token and the file that contains your style library.

Plugin Details

Version2
CreatedJuly 17, 2023
Last UpdatedJuly 18, 2023
CategorySoftware development
CreatorWilliam Zhuang
Stats59 installs, 3 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/ui.html
  • main:dist/code.js
  • Editor Types:
    figma
  • Codegen Languages:
    • React(react)