| ▲ | Show HN: Open-source Figma design to code(github.com) | ||||||||||||||||
| 27 points by alepeak 19 hours ago | 8 comments | |||||||||||||||||
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/) | |||||||||||||||||
| ▲ | mdtrooper 2 hours ago | parent | next [-] | ||||||||||||||||
There is https://penpot.app too. Although IMHO as I wrote some years ago in my blog (sorry only in spanish) https://tomatesasesinos.com/2023/01/09/proyectos-que-son-una... TL;DR: Penpot team chose a bad dev language. | |||||||||||||||||
| ▲ | dfajgljsldkjag 5 hours ago | parent | prev | next [-] | ||||||||||||||||
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... | |||||||||||||||||
| |||||||||||||||||
| ▲ | 65 2 hours ago | parent | prev | next [-] | ||||||||||||||||
This app idea has been made a million times and never works. It's also not hard to make a few divs and copy and paste styles from Figma. I wish you luck with your project. | |||||||||||||||||
| ▲ | jamesuw7r1 11 hours ago | parent | prev | next [-] | ||||||||||||||||
How does it work? | |||||||||||||||||
| ▲ | pojntfx 5 hours ago | parent | prev [-] | ||||||||||||||||
This is not open source, it's under a proprietary (FSL) license: https://github.com/vibeflowing-inc/vibe_figma/blob/main/LICE... | |||||||||||||||||
| |||||||||||||||||