Sitemap

How To Convert Figma UI To Flutter Widgets

2 min readAug 16, 2020
Press enter or click to view image in full size
Photo by v2osk on Unsplash

Sometimes, we just want the designed UI directly into the app without much hassle of writing code and fixing the bugs.

No, doubt. There are other applications/software e.g. Adobe XD which provides plugins like xd to flutter to directly convert the UI designed in Adobe XD to Flutter Application.

Press enter or click to view image in full size
Credits: — Avocode and Figma

Now, there is another application/software in this competition of UI. That’s Figma, A vector graphics editor, and prototyping tool. It provides great tools and easy User Interface to design Android and iOS-based UI and allows us to view the prototypes on mobile devices.

Press enter or click to view image in full size
Credits: — Figma

Figma-to-flutter is a dart code generator (for flutter UI) that converts Figma components to Flutter widgets.

Visit here to check the repo and web version as well

Sachin Kumar
Sachin Kumar

Written by Sachin Kumar

Hi, I am a robotist enthusiast and electronics hobbyist