{Figma App} Turn HTML, React, Next.js, Vue, and Svelte into clean Figma designs

Summary: Max Babenko is seeking feedback from DesignOps and design-system teams on incorporating existing UI from HTML or React/Next.js projects into Figma when original files are missing or outdated. They have developed a tool called Source → Design that imports various projects as editable Figma layers and are interested in feedback on aspects like layer structure and Auto Layout behavior. They provided links to the plugin and more information on a website.

AI Summary

I’m looking for feedback from DesignOps and design-system teams on a workflow question.

When a product UI already exists as HTML or a React / Next.js project, how does your team bring it back into Figma when the original file is missing or out of date?

I built Source → Design to test this workflow. It imports HTML, React, Next.js, Vue and Svelte projects as editable Figma layers rather than a screenshot.

I’d especially value feedback on layer structure, Auto Layout behaviour and the scenarios where this could genuinely help a design team.

Plugin
https://www.figma.com/community/plugin/1671982756700161071/html-to-figma-react-next-js-source-design

Website
https://sourcetodesign.com/

0 comments