screenshot-to-code
by abi
A web app that turns screenshots, mockups, Figma designs and screen recordings into working front-end code using AI models. It outputs code in stacks such as HTML with Tailwind, React, Vue, Bootstrap and Ionic.
- Stars
- 80.9k
- Licence
- MIT
- Runs on
- A small server
- Setup
- Moderate
- Language
- Python
- Age
- 1081 days
What you can do with it
- Upload a screenshot of a web page and get HTML and Tailwind code that recreates it
- Convert a mockup or Figma design into React or Vue components
- Record a website in action and turn it into a working prototype
Make money with it
A freelancer could offer fast landing-page or prototype builds from client designs, using the generated code as a starting point and charging for the finishing and polish.
An idea, not financial advice. Check the licence before charging for anything built on it.
Ways a business could use it
- Turn client mockups into first-draft front-end code, cutting the time spent on building landing pages
- Quickly prototype a copy of an existing page layout to test ideas before paying for full development
Can you use it commercially?
Free to use, change and sell, including in paid products. Keep the copyright notice.
Not legal advice. Read the project's licence file before building a product on it.
Getting it running
Run it with Docker Compose, or start the Python (Poetry, FastAPI) backend and the pnpm React frontend separately, after adding at least one AI provider API key.
Follow the official instructions in the project README.
Things to check
- Needs paid API keys from AI providers such as OpenAI, Anthropic or Gemini, so each generation costs money
- Best results also need a Replicate key
- Local open-source models via Ollama give poor results, according to the README
- Copying other people's websites may raise copyright or design-ownership concerns
Who's talking about it
Checked 31 Oct 2026. Summary drafted by AI from the project's README.
