Superflex - Write Front-End Code 10x Faster ⚡️

👋 Hello Fellow Builders, Thank you for checking out Superflex 🦾 🙇 Problem: We initially built this out of our own frustrations of spending too much time writing front-end code and dealing with UI components. We would rather spend more time on business logic than matching our front-end to Figma files. 🦾 Here is what Superflex can do: 1. Turn Figma files, images and text prompts into production-ready code 2. Match your existing coding style and design system. 3. Utilize your existing UI components. 4. Chat with your codebase 5. Debugging and refactoring 🤔 How it works: It's a VSCode extension, so you can easily install it and use it right away on VSCode or on VSCode-based editors like Cursor, Pear AI, etc. 🥰 How do I start using it? Once you install Superflex, it will pop-up on your extensions window. Open it, create an account with email or Google, and give it an image, Figma file or a prompt. 🧑‍💻 Can I clone the extension? Yes! We open-sourced our extension, so you can clone it and use as you like. We will work with our community to add new features, improve our UI so feel free to submit pull-requests. There is a lot that we can do together. As of now, our backend is not open-sourced yet but we are planning to release it in the upcoming week. 🥇 Why should I use it for front-end instead of Cursor? We are focused on the front-end, which allows us to give less context to existing LLM's to provide better output than horizontal tools that do fine-tune LLM’s to do everything. We also integrate with Figma and will continue adding more features for front-end code. 🤨 Do you store my codebase? Yes, but we will never store your whole files. We chunk your code into small pieces and embed it in a vector storage to provide code that matches your coding style, reuses your UI components etc. It’s similar practice to existing tools like Cursor. We are working on an even better implementation where we will never even store your code chunks - once we launch it we will share it in a blog. ❤️ How can I help the Superflex team? If you want to help our team, please try out our extension, and if you like it, give it an upvote. We are still in the early phases so we will improve it a lot. So if you have any suggestions or encountered any issues, please email boris@superflex.ai. P.S. You can follow us on Twitter at https://x.com/superflex_ai, Instagram at https://www.instagram.com/superf... and LinkedIn at https://www.linkedin.com/company...

Looks very nice! However I'm trying to use it in Cursor (VSCode Fork) but annoyingly when it opens the sign-in link in my browser and after successfully logging in, it opens a brand new window of Cursor!! Therefore the initial signin just times out since it never got a response and in the new window of Cursor, it's not logged in either. And of course when I try signing in from the new window, it opens yet another new window.... Any idea how to resolve this? I'd really like to test it out. I know some extensions, like Codeium for example, allow you the option to get a confirmation code from the browser and then paste it in vs code.

@superaibek Congrats on your product launch! Superflex is a game-changer for front-end development—turning Figma files into production-ready code is brilliant. Excited to see how it simplifies the coding process. Great work!

Wow awesome web development tool. Supported. Good luck with the launch

This is neat. Just not sure how it adapts to my coding stile/project? It always returns react code, although my framework is laravel. Anything settable in the settings?

Congrats! Could I take a screenshot of another website to clone it?

@superaibek Superflex is an exciting tool for transforming ideas into front-end code directly from Figma or text prompts, making development much faster and more efficient. The ability to match coding styles and integrate UI components is a great feature. It would be interesting to know how well it handles edge cases or more complex design structures during the code generation process.

Congrats on the launch 🎉 Excited to see you are going the open source route 🙌

Hey Aibek, How does Superflex handle more complex UI interactions or animations. Can it generate code for these as well? How does it ensure the generated code follows best practices for performance and accessibility? Congrats on the launch!

Love the idea of LLMs targeted to specific areas of development to improve the quality of the suggestions

Superflex sounds like an incredible game changer for front-end developers! 🚀 Thanks for bringing this innovative tool to life, @superaibek! You’re making our lives a whole lot easier!

Awesome work on it! The ability to build features 10x faster and integrate with Figma designs is impressive.

How is it different from screenshottocode?

Superflex is a game-changer for front-end development! You're not just building better frontends faster—you're also enhancing the efficiency and accuracy of your workflow 🏆

I'm really curious about one main thing: does this offer functional code or just styling code like V0 did? If it does include functional code, I'd happily pay for it!

Congrats on the launch! 🚀 Superflex sounds like an incredible tool for frontend development!

that's a beautiful logo ! congrats on the launch!

Congrats guys on the launch. Will definitely give it a try and share my opinion here :)

Saves a lot of dev time! Can't wait for more features and updates from your team!

Congrats on the launch! Hoping it to get it used by my team :) now