DEV Community

Cover image for We Built an AI Frontend Generator — Sharing It With the Dev Community
Arsalan Mlaik for Arsalan Malik

Posted on

We Built an AI Frontend Generator — Sharing It With the Dev Community

We've been working on a tool called Make Your UI to speed up one of the repetitive parts of frontend development: turning a design idea into working code.

The basic workflow is:

Prompt / Screenshot → Generate → Preview → Refine → Fix → Export

You can start with a simple description of a UI or upload a screenshot. The tool generates the frontend and lets you see the result directly in the browser.

What we've built

  • Text-to-code generation
  • Screenshot-to-code
  • 15+ JavaScript framework targets
  • 20+ CSS/styling options
  • Live desktop, tablet and mobile preview
  • Refine the existing UI using natural-language instructions
  • Runtime error detection and Fix Error
  • Code explanation
  • Code export

The part we've found most useful is the iterative workflow. Instead of generating code, opening a separate project, finding an issue and going back to the AI, you can generate and refine the interface in the same place.

We're sharing it with the developer community because we'd genuinely like feedback on how well it handles real UI screenshots and whether this workflow actually saves time compared with existing approaches.

Try it:
Make Your UI

Dev Community Offer

We're offering our first 20 users 40% off the Basic Package while we gather early feedback.

Claim the 40% Developer Community Offer

The discount currently works with PayPal.

If you try it, we'd particularly like to know where the generated UI is accurate and where it still needs improvement.

Top comments (0)