Is screenshot-to-code still maintained?

Yes, active. Last change today.

How widely used is screenshot-to-code?

Widely used. 81k stars, 3 years old. As with any download, get it from the official repo.

gitmanual

Reading the repo

Opening the box…

How to set up screenshot-to-code (abi/screenshot-to-code) · gitmanual

Assembly instructions

abi/screenshot-to-code

Drop in a screenshot and convert it to clean code (HTML/Tailwind/React/Vue)

Node.js

Before you start

Is it free?: YesOpen source (MIT).
Still maintained?: Yes, activeLast change today.
How widely used?: Widely used81k stars, 3 years old. As with any download, get it from the official repo.

Difficulty: Moderate
Time: about 15 min
Stars: ★ 81,212
Activity: Updated this month

Fresh setup, read just now

Will it work on macOS?

Yes, with Docker on macOS

It's a self-hosted app: the README runs it with Docker, and you open it in your browser.
On macOS that means installing Docker Desktop first.

Your system

macOS Windows Linux

Start here

Website ↗screenshottocode.comThe project's own site.

Heads-upBuilding it yourself? It also needs 3 settings in .env (1 secret).

Run it with Docker

A self-hosted app: Docker runs it on your computer and you open it in the browser. Needs Docker Desktop (or Docker Engine on Linux). Run docker compose commands inside the cloned repo folder.

DockerNeeds Docker

docker-compose up -d --build

From the README, exactly as the maintainers wrote it.

Did you get it running?

No reports for macOS yet.

Still stuck? Get a written guide

GitManual AI Agent reads the 6 key files and writes a step-by-step guide for macOS. Once written, it's saved for everyone.

Parts list

1×Node.js LTS (no version pinned)runtime
1×pnpm pnpm@10.32.1package manager

3× settings in .env

TEST_SCREENSHOTONE_API_KEYsecret
TEST_ROOT_PATH
VITE_WS_BACKEND_URL

Share this manual

Is this your repo?

Add a badge to your README so newcomers find these steps.

[![Setup manual](https://gitmanual.com/abi/screenshot-to-code/badge.svg)](https://gitmanual.com/abi/screenshot-to-code)

Good to know

Monorepo (workspaces) — install from the repo root.
Has AGENTS.md — instructions for coding agents. You can open Claude Code (or another agent) in the cloned folder and ask it to do the setup for you.
Nested projects: backend/pyproject.toml, frontend/package.json

Details

License: MIT
Open issues: 149
Branch: main

package.json scripts (3)

testpnpm run test:frontend && pnpm run test:backend
test:frontendpnpm -C frontend test
test:backendcd backend && poetry run pytest

Files we read (6)

README.md

backend/pyproject.toml

docker-compose.yml

frontend/.env.example

frontend/src/.env.jest.example

package.json

316 files in the repo

Contact