Skip to main content

D2code intro

Design to code. easily customize conversion rules. Highly reusable code

Features

  • default Code Generation: Support react + tailwind, react native +tailwind。 react native +style。 conversion effect preview。
  • component conversion Support:Mark the component to convert the corresponding custom component code。 create libs json info.
  • code with image url:By configuring filekey and token, it can be displayed with pictures in the design diagram.
  • easily custom DSL: such as flutter, vue, swift
  • D2C2D:Precipitate the marked figma componentSet, and libs json, which can greatly improve development efficiency

How to use

  • Selecting a layer will automatically convert out the code
  • mark the layer's name with "#CustomComponent" such as "#Button"
  • Copy and paste or save code file to you demo or project
  • After the test is perfect, package the custom component, write libs json, and let the designer precipitate componentset with mark

Tips:

  • Currently only autolayout is supported, non-autolayout will be supported in the future
  • Try to keep the layer structure as simple as possible to avoid overlapping layers