Skip to main content

We are a team of programmers and graphics designers that are all hoping to be able to utilize Figma so that our Front End GUI team will be able to pass along React ready layouts and code to our senior developers.


What is the best method to do this. We have spent the past week or so with creating a ‘project’. A simple inventory control page for example, but there seems to be a lot of options in regard to what plugin or system is best to switch it to react code.


Have people been able to just utilize the inhouse Figma to Code as best results or is it best to utilize a 3rd party. I would really like some input.


I’ve seen online about using : Anima

I saw a board posting here in this forum from a company called : ‘Copy Cat Team’ for their software

and I saw a video that utilized : DhiWise software plug in


Since we are right at the beginning of 10 large projects, I really want to get this right the first time. I would really like to hear/know people’s thoughts or suggestions on the best way to get the Figma Project to React


Thank you

Hi, we are trying to go for the best design to code program as well. I’m wondering if you have found one?

Dear Figma community,


has there been any update on this topic?

We actually tried out the builder.io plugin, which generates… well let’s say usable Typescript/React code, but there’s definitely much room for improvement, because lots of work is still needed to adapt the generated code to your frontend library (Bootstrap, Material-ui, IBM Carbon…). Are there any good or better alternatives?

The amount of work needed to convert Figma designs (manually) to code is huge, there must be some kind of good automation tool or plugin for this.


Any recommendations or experiences in this area?

It’s great that your team is thinking ahead for such large-scale projects! Figma is a brilliant tool, and there are several ways to convert designs to React effectively. While Figma’s in-house plugins like Anima are handy, third-party options such as CopyCat and DhiWise tend to provide more flexibility and features, especially for complex projects.

For the best results, consider your team’s workflow. Third-party tools often produce cleaner code, making it easier for senior developers to work on. Regardless of the method, prioritising cross-browser compatibility ensures your projects function seamlessly across all devices and browsers.

Reply


Terms & ConditionsCookie settings