pixels2flutter
VerifiedOpen-source tool that turns a UI screenshot into runnable Flutter code
Product preview
pixels2flutter
What it is
pixels2flutter is a free, open-source web app that converts images of user interfaces into Flutter code. You upload a screenshot of an existing app, a design mockup, a wireframe or even a hand drawing, optionally add instructions about behavior, and the app sends it to a multimodal model such as OpenAI GPT-4o or Google Gemini to generate Flutter code. The output is saved to a GitHub Gist and loaded into DartPad, so you can run and tweak the result in the browser immediately. It is aimed at Flutter developers who want a quick starting point for a screen. The project is licensed under AGPL-3.0 and relies on your own API keys.
Key features
- Screenshot or wireframe to Flutter code
- Optional behavior instructions
- OpenAI or Gemini model choice
- Runs output in DartPad via GitHub Gist
What we liked
- + Free and open source
- + See the generated app running instantly
- + Works from sketches as well as screenshots
Worth noting
- · Requires your own AI and GitHub keys
- · Output needs cleanup for complex screens
Editor's notes
More context from AI BirdView
For Flutter developers, getting from a picture of a screen to working widget code is often tedious layout work. pixels2flutter shortens that step in a refreshingly simple way: upload an image, let a multimodal model write the code, and watch it run in DartPad moments later. Because it is open source, you can see exactly how it builds prompts and handles the generated code.
- Converts real app screenshots, design files, wireframes and drawings
- Optional extra instructions describe interactions or logic, such as how a button should behave
- Lets you choose between OpenAI and Google Gemini multimodal models
- Stores output as a GitHub Gist and opens it in DartPad for instant testing
- AGPL-3.0 licensed code that you can inspect, self-host or adapt
It is best for Flutter developers, students and designers who want a fast first draft of a screen rather than finished production code. A practical tip: crop your screenshot to a single screen and describe any interactive behavior in the instructions box, since focused inputs tend to produce cleaner widget trees that are easier to refactor afterward.
Reader reviews
From people who've used pixels2flutter. Emails are never shown publicly.
No reviews yet. Be the first to share your experience.
Alternatives to pixels2flutter
Other tools we like in this space.
v0 by Vercel
Prompt to production-ready React UI
Lovable
Chat your way to a full-stack app
Bolt.new
Full-stack apps generated and run in your browser
Anything
Formerly Create: describe an app and get iOS, Android, and web versions