Onlook is an open-source, local-first, visual editor for React Apps. Design directly in your React App, and instantly write all of your changes to code. Craft your interface with a next-generation design tool that will help you ship faster than ever before.
Hey Product Hunt! I’m super excited to share Onlook with you –
@flyakiet and I started working on this version of Onlook just a few months ago, and the reception from the design and development community has been extraordinary, even with a partially built product. Now that we’ve had a chance to buff-out the rough edges, we’re ready to share it with the broader Product Hunt community.
As a designer myself, I’ve always been frustrated with the gap between what I would make and how it would be implemented. There are, of course, a number of tools that let everyone get better at coding, but most editors are either still too technical or require a technical background to actually work with. Plus, developers really really don’t like the output of most design-to-code exporting tools. It’s a frustrating problem for both sides of the design / dev equation!
We aim to give more people the opportunity to create with our visual-first code editor. Everything you do in the Onlook canvas is immediately reflected in code, and because Onlook runs locally, you can take all of the code it writes for you.
For now, Onlook still requires a little bit of technical knowledge to fill in some of the gaps in our product, but we’re confident that even now, more and more less-technical people will be able to build incredible apps and websites with our take on a visual editor.
I wanted to extend an extremely well-deserved thank you to the 40(!!) contributors who have generously jumped-in to help make the editing experience polished. From the tiniest details to critical features, Kiet and I are grateful for the expertise, opinions, and determination that the open-source community has committed to Onlook. In all honesty, it’s driven us to build something great that we hope will make everyone’s effort worth it. Thank you!
Finally, we recognize that the quality bar of software has lifted significantly, and we hope that a tool like Onlook can help other tools reach that new requirement. I’ve personally felt so empowered to push the limits of my own design skills after working on this tool, and it’s a feeling I know you’ll experience when you use Onlook on your site.
When you start to design the real product rather than mockups, you fall in love with designing all over again.
