p/kombai-research-preview
A new AI model that you can prompt with UI designs
Dipanjan Dey
Kombai — A new AI model that you can prompt with UI designs
Featured
355
New ensemble model purpose-built to understand and code UI like human devs. Prompt it with designs. Get high-quality UI code in seconds. No manual tags or auto-layout needed. Logical DOM structure & React components. CSS with no hardcoded dimensions. Clean JS.
Replies
Dipanjan Dey
Hello world, from team Kombai! We are excited to launch our private research preview on ProductHunt! Thanks a lot for dropping by.🙏 WHAT IS KOMBAI Kombai is a new ensemble model that can understand and code UI designs like humans. You can prompt it with design files in Figma to get high-quality React and HTML + CSS (vanilla/ tailwind) code in just a single click per component. MOTIVATION Over the past few years, frontend and fullstack devs have been complaining loudly about how tedious and cumbersome it is to code UI, particularly CSS. As developers, we have experienced this firsthand, heard our friends grumble about it, and laughed at countless memes about this in every corner of the internet where devs assemble (e.g., r/programmerhumor). However, it has only gotten worse with time - with increasingly complex designs and frontend tech stack. Design tools like Figma and XD, while great for designers, don’t generate useful code for devs. Design-to-code tools built on top of them only produce unusable spaghetti code. Even Chatgpt, such a great help in writing boilerplates and functionalities, cannot really help in translating designs! So, we thought we’d take a stab at making frontend development fun again for the devs who build all these beautiful experiences that make the modern internet what it is. KEY FEATURES Kombai’s proprietary ensemble model is able to “look at” complex, real-world designs, derive these inferences as a developer would, and generate code using that “understanding.” 🤩No manual pre-processing needed - no tagging, grouping, naming the elements, or using auto-layout is required, either in Figma or in the product itself 🥳High-quality code that can be actually used in prod: logical, div-structures, React components and names; appropriate flex CSS without hardcoded dimensions; clean JS code with loops and conditions; form elements as functional components. EVOLUTION & NEXT STEPS We developed Kombai with feedback from over 500 developers who accessed our private research preview. Their invaluable time and feedback have enabled us to rapidly and iteratively improve our underlying models. In the public research preview phase, our goal is to learn about Kombai’s strengths and weaknesses as more and more developers try it out. So, please give us a try and let us know your feedback using the options in the app or at support@kombai.com. Our team will also be live on Producthunt throughout the day to answer your questions and gather your input. We'll plan to leverage these learnings to improve the underlying models further and, hopefully, make frontend development fun again for y’all! —----- Dipanjan Co-founder & CEO, Kombai
Kausambi Manjita
@dipanjan_dey literally the only product I need now haha :) Is there a dribbble connector in the works? A tonne of times I drive inspo from behance dribbble for product updates that need immediate - and tried and tested - solution.
Dipanjan Dey
@jackson_huge Thanks a lot for checking us out and for your encouraging feedback. Please help spread the word around so that we can get more developer feedback! :-)
Dipanjan Dey
@kmanjita haha! You just made our day! If a design in dribble in behance has its Figma files available, you can easily use that on Kombai. However, if it's only an image file - unfortunately, we don't know how to support that yet. We read the vector images via Figma API and get definitive CSS properties, like color, box-shadow, font etc. from it. Most image-based object detection algos cannot capture such nuanced properties accurately. And honestly, we don't know any novel approach that might solve that problem :-( Do you usually use Figma files/ other vector formats from Dribble/ bahance? or just jpegs/ pngs?
Kausambi Manjita
@dipanjan_dey while working with an internal design team - or a great web / app engineering team - luckily you have the luxury of using png ET al 🤷‍♀️
Dipanjan Dey
@kmanjita haha. fair enough. Hope to support image imports someday!
flo merian
💎 Pixel perfection
really enjoy the care you put into the app UI, especially for an early-stage team. love the examples in the gallery, too! definitely worth checking out. the premise of prompting AI with design is promising. many developers will get value from this. keep up your great work, ?makers!
Abhijit Bhole
@fmerian Than you flo for your encouraging words. Please give us feedback and help spread the word.
Dipanjan Dey
@fmerian Hey Flo! Thanks a lot for checking us out. Big fan of your work around dev marketing and awesome-developer-first! Please help us spread the word so that we can get more feedback! :-)
flo merian
@dipanjan_dey thanks, Dipanjan! happy to add Kombai to awesome-developer-first, please open a Pull Request. cc @agamm
Mohamed Reda El Ghazouani
Seems to be a great tool especially for people who don't have a team like me hahahah, and it will help me a lot in my future projects. 🌟
Abhijit Bhole
@iimedr Thank you Mohamed!
Sanchit Malik
Congratulations @dipanjan_dey for the launch. Have been a user of Kombai and must say the value of the product is phenomenal for designers and front end developers
Abhijit Bhole
@maliksanchit Thank you Sanchit!!!
Neeraj Kumar
Looks interesting! Any similar thoughts for mobile app code generation?
Jonas Urbonas
This is incredible. I've not played around with it yet, but if it does what it says on the tin...it's a game-changer for me as a product designer 🤯
Abhijit Bhole
@jonurbonas Thank you Jonas for your support. Please try Kombai and give us feedback.
Jake Tital
Cool use of ai technology. Looking forward to see where this project goes.
Abhijit Bhole
@jaketital Thank you Jake
Eddie Forson
Congrats on the launch! Been following Kombai for a couple of weeks now so excited for you to officially release it today. Questions: What library/Framework do you generate the JS + css in (e.g. React + Tailwind, etc.)? What's next?
Abhijit Bhole
@ed_forson Thank you Eddie! We generate code in Tailwind / Plain CSS as well as React and HTML / CSS. We will be working on supporting more frameworks and libraries.
Vikram Aditya
This is going to be very interactive for side hustles. Gonna give it a try.
Abhijit Bhole
@viks_rum Thank you Vikram. We hope you can integrate Kombai in your regular workflows also!
Arbaaz
Congratulations!
Ashish Tayal
Congratulations @dipanjan_dey @bholebababa & the @Makers Reviewed the product docs to start with and this product looks promising. Best wishes and cheering for you guys!!
Abhijit Bhole
@ashish_tayal91 Thank you Ashish for the encouraging words. Please try Kombai.
Dipanjan Dey
@bholebababa @makers @ashish_tayal91 Thank you for checking out the docs! @anbhole wrote all of that literally in half a day. Glad that it still came out okay :-)
Jacky Pan
This is a gamechanger in UI development. Can't wait to try it out myself.
Mukund Mohan
@jackypan1989 Thanks Jacky! Please let us know about your experience with Kombai, once you do give it a spin :)
Darya Krakaviak
What an awesome result you guys!! 😍 Huge congrats!!
Nirmalya Ghosh
Congratulations on the launch 🎉 I had the privilege of using Kombai before the launch and it was amazing to see how Kombai outputs clean code. I have used multiple apps to generate code from designs but Kombai does a brilliant job at this.
Abhijit Bhole
@ghoshnirmalya Thank you Nirmalya for your support :-)
Johan Steneros
Awesome. So many things are chaning these days with AI. Does it handle responsiveness automatically as well?
Jannik Andersen
Well done on the launch. Looks like a really nice tool to convert Figma design to HTML easily. Well for sure give it a try👍😊
Abhijit Bhole
@jannikandersen Thank you Jannik. Please try Kombai.
Ashish K Mishra
This is really useful
Rishi Sanghvi
@ashishk36 Thank you Ashish!
Preet Mishra
This looks promising! Congratulations on the launch.
Abhijit Bhole
@wickedmishra Thank you Preet.
Dipanjan Dey
@wickedmishra Thanks a lot for checking us out, Preet!
Josh Fowler
This is so cool! Congrats on the launch. Does it work for mobile UI code?
Dipanjan Dey
@joshfowler Thank you! It should work for mobile websites that are written in React or other JS frameworks. However, it cannot yet generate code for mobile apps.
Julien Zmiro
That sounds really cool team! I'm super eager to see how AI can help with coding or building in general. Well done!
Dipanjan Dey
@zmiro Thanks a ton! Please try the product, give us feedback and helps spread the word around :-)