logoalt Hacker News

Show HN: Open-source Figma design to code

19 pointsby alepeaktoday at 6:09 AM6 commentsview on HN

Hi HN, founders of VibeFlow (YC S25) here.

We mostly work on backend and workflow tooling, but we needed a way to turn Figma designs into frontend code as a kickstart for prototyping. It takes a Figma frame and converts it into React + Tailwind components (plus assets).

If you want to try it: You can run it locally or use it via the VibeFlow UI to poke at it without setup (https://app.vibeflow.ai/)


Comments

dfajgljsldkjagtoday at 7:59 PM

Interesting. It appears this doesn't use AI itself (though it's probably vibe coded). Figma in dev mode already gives react components and css styles [1] and this seems like a more automated way to pull that functionality. It's unfortunate figma paywalls dev mode and this might be a good way to work around the limitation.

1: https://help.figma.com/hc/en-us/articles/15023124644247-Guid...

show 1 reply
jamesuw7r1today at 2:48 PM

How does it work?

pojntfxtoday at 8:41 PM

This is not open source, it's under a proprietary (FSL) license: https://github.com/vibeflowing-inc/vibe_figma/blob/main/LICE...

show 1 reply