Screenshot to Code

software

★★★★½4.3(0 reviews)

About

Open-source tool that converts screenshots to HTML/Tailwind/React code using AI vision. Upload a screenshot, get working code.

Overview

Screenshot to Code is a popular open-source tool that uses GPT-4 Vision and Claude to convert UI screenshots or Figma designs into clean HTML, Tailwind CSS, and React code. The project gained rapid community traction for bootstrapping UI from mockups and supports multiple output stacks. Better suited for prototyping and design handoff than generating pixel-perfect production code.

ai screenshot code-generation html react open-source

Pros

+Free and open source
+Surprisingly accurate
+Multiple output formats

Cons

-Accuracy varies
-Simple layouts only
-API costs for models

Visit website

This may be an affiliate link — the creator and GuruStacks may earn a commission, at no extra cost to you. Learn more

Details

Typesoftware

Pricing

Model

open source

Platforms

web

Community

Listed in Stacks

Vibe Coding

The ultimate toolkit for vibe coding — AI-powered development tools, no-code builders, and rapid prototyping platforms that let you build by describing what you want.

by Gurustacks0

Similar tools

View alternatives →

Locofy

4.4

design-to-codefigma-pluginai-code-generation

AI-powered design-to-code platform that converts Figma and Penpot designs into production-ready frontend code for React, Next.js, React Native, Flutter, Vue, Angular, and HTML/CSS.

React Native

4.5

javascriptmobilereact

Meta's open-source framework for building native iOS and Android apps using React and JavaScript, sharing code across platforms.

Anima

4.5

design-to-codefigma-plugincode-export

Design-to-code platform that converts Figma, Adobe XD, and Sketch designs into developer-friendly HTML, CSS, React, and Vue code with responsive layout detection and live previews.

tldraw

4.4

whiteboarddrawingai

Open-source collaborative whiteboard with AI features. Draw wireframes and convert them to working code with the Make Real feature.

ComfyUI

4.4

aistable-diffusionimage-generation

Powerful and modular node-based visual editor for designing and executing advanced AI image and video generation pipelines using Stable Diffusion and other models.

Vercel AI SDK

4.4

aitypescriptsdk

TypeScript toolkit for building AI-powered applications. Provides unified API for calling any LLM, streaming UI components, structured data generation, and tool calling.