mrkeyoor.com_
Fri 16 Oct 18:54 UTC
AI Toolsevaluationupdated 16 Oct 2026

screenshot-to-code review

Screenshot to Code turns screenshots, mockups, and screen recordings into editable web page code using AI services. It helps developers rebuild a visual reference without writing the initial layout by hand.

+215stars / 7d
Verdict

Our Screenshot to Code run installed 805 packages in 175 seconds, then stopped before backend testing because Poetry was missing. Use it for supervised screenshot reconstruction if you can maintain the Python service and accept external model calls. The 55 vulnerabilities reported by our audit warrant advisory review before exposing that version to other users.

We ran it

Lab card: what happened when we ran screenshot-to-codeScreenshot of screenshot-to-code (screenshottocode.com)
Install✓ · 175s805 packages · 344 MB
Buildn/ano build script
Tests✗ · 6s42 passed · 0 failed · 6 skipped of 48 (jest)
Known vulns551 critical · 50 high · 4 moderate · 0 low (npm audit)
Repo315 files~39,986 lines of source · 2.7 MB · 0 CI workflows

Answers from our run

Does screenshot-to-code build from source?

Dependencies installed in 175 seconds (805 packages), and the project has no separate build step. We cloned commit d026163 into a clean Debian container with 3 CPUs and no project-specific setup.

Do screenshot-to-code's tests pass?

Yes: 42 of 48 passed when we ran the project's own test command (jest). Some failures need services or credentials a bare container does not have.

Does screenshot-to-code have known vulnerabilities in its dependencies?

npm audit flagged 55 known advisories in the dependency tree, including 1 critical at the time of our run.

Who should not use screenshot-to-code?

Teams requiring fully offline generation: the documented setup needs a model-provider key, and the README discourages its linked Ollama route on quality grounds.

What are the alternatives to screenshot-to-code?

Bolt.new, Make Real starter. Our Screenshot to Code run installed 805 packages in 175 seconds, then stopped before backend testing because Poetry was missing.

Setup2/5JavaScript install passed; Python tooling and browser setup remain
Docs4/5Explicit provider, Poetry, browser, and configuration instructions
Community4/5October push and recent issue and PR activity
Maturity3/5Useful documented workflow; backend tests did not run in our sandbox

Discussed on

  1. hnShow HN: Convert any screenshot into clean HTML code using GPT Vision (OSS tool)358 points
  2. hnShow HN: Turn a video of an app into a functional prototype with Claude Opus17 points

Who it’s for

Frontend developers who regularly rebuild interfaces from screenshots and will review the generated code.
Teams that want to modify a React/Vite frontend and Python backend around their own visual reconstruction workflow.
Prototypers who already have approved model-provider access and a concrete design reference.

Who it’s NOT for

Teams requiring fully offline generation: the documented setup needs a model-provider key, and the README discourages its linked Ollama route on quality grounds.
Windows developers who need dependable screenshot preview under reload: open issue 636 reports a Playwright startup error that disables that tool.
Teams expecting image editing and background removal from a basic model key: those features require Replicate configuration.
Developers expecting the documented Compose route to support live code changes: the README says file changes do not trigger a rebuild in that setup.

Setup reality

Our October 3, 2026 sandbox run at d026163 installed 805 packages in 175 seconds and occupied 344 MB. Tests exited 1 after 6 seconds: Jest reported 42 passed, 0 failed, and 6 skipped out of 48 before the backend command stopped at poetry: not found. No build target was detected, so build was skipped. Npm audit reported 55 vulnerabilities: 1 critical, 50 high, and 4 moderate.

Local operation needs a model-provider key plus separate frontend and backend configuration. The README documents pnpm for the frontend and Poetry for the Python backend. Replicate needs its own backend credential for image operations.

Optional screenshot preview needs Chromium. On Linux its system libraries may require sudo or apt access. Our container ran without elevated privileges. The log also warns about pnpm workspace configuration. Windows issue 636 separately reports a Playwright error under reload.

You get editable page code from a visual reference

Screenshot to Code accepts a screenshot or mockup and generates page code in formats including React with Tailwind and plain HTML with CSS. Its README also describes turning a screen recording into a functional prototype. I'd use it when the reference already settles the visual direction and a developer will own the result. A screenshot leaves application behavior unspecified, so treat the output as the beginning of implementation.

The checkout in our lab occupied 2.7 MB across 315 files and roughly 39,986 lines of source. Installation expanded the footprint to 344 MB. That is manageable for a developer machine, but this is a service you maintain alongside the generated pages. The appeal depends on how often rebuilding interfaces from visual references is actually part of your work.

What happened when we ran it

Our sandbox installed commit d026163 in 175 seconds, adding 805 packages. We ran it on October 3, 2026, in a fresh Debian container using lab-node:22, with 3 CPUs and 8 GB of RAM, without secrets or elevated privileges. The install succeeded. That result establishes that the measured JavaScript installation completed in this environment. It does not establish that the Python backend or a generation request worked.

The test command exited with code 1 after 6 seconds. Jest reported 42 passed, 0 failed, and 6 skipped out of 48 tests. Then the command entered backend and tried poetry run pytest. The shell returned poetry: not found. The full suite therefore failed at the backend handoff, before that command could run pytest. Calling this a failed backend assertion would misread the log.

The log also warned that pnpm does not support the root package's workspaces field and requested a pnpm-workspace.yaml file. Our harness found no build script or target, so it skipped the build. Neither observation proves that the frontend cannot be built through another route. The measured result is narrower: installation completed, Jest assertions passed, and the combined test command stopped with a missing executable.

The audit makes an unrestricted deployment hard to recommend

Npm audit reported 55 known vulnerabilities: 1 critical, 50 high, and 4 moderate. Those findings belong to the dependency tree measured at d026163. The supplied report does not identify affected packages or reachable application paths, so it cannot establish an exploitable public endpoint. It does give an operator concrete work before putting this version on a shared server. I would start with restricted access and inspect the advisories before widening it.

Our scan detected 0 CI workflow files and no Dockerfile, while finding a Compose file and workspace configuration. It also reported no tests directory. These are scan results, not proof that checks or nested files do not exist. The current testing guide explicitly points to backend/tests. For adoption, the failed command and audit findings carry more weight than a directory signal taken alone.

Poetry is a documented prerequisite that our container lacked

The backend manifest specifies Python ^3.10 and uses Poetry, with FastAPI serving the application. The root package script chains frontend testing to cd backend && poetry run pytest. That explains why a successful JavaScript install cannot stand in for preparing the backend. The README explicitly tells users without Poetry to install it. Our missing executable is a setup boundary the documentation acknowledges, rather than evidence of an unmentioned requirement.

The 175-second install did not validate the browser setup either. The README describes an optional Chromium preview that lets the agent render generated pages and inspect them visually. Linux users may need browser system libraries and an installation step requiring sudo or apt access. Without Chromium, that tool is skipped. Decide whether that check matters to your workflow before treating the service as ready.

Windows users have a more specific reason to pause. Open issue 636 documents a Playwright startup error under Uvicorn reload, including NotImplementedError and a message that disables screenshot preview. That report concerns the preview browser in this application. It is separate from the missing Poetry executable in our Debian run. If Windows reload development matters, reproduce that path before choosing the project.

A local server still needs model-provider access

The documented local route needs at least one OpenAI, Anthropic, or Gemini credential. Gemini enables asset extraction and is required for video mode. Replicate supplies image operations, including background removal. That makes this a poor choice for someone whose definition of self-hosting requires keeping every generation inside their own infrastructure. The README links an Ollama route but discourages it on quality grounds. That is the maintainer's assessment, not a comparison we measured.

Our 42 passing Jest tests provide no measurement of screenshot fidelity, generated behavior, or provider cost. The sandbox had no secrets, and the supplied results contain no completed generation benchmark. Before adopting it for client work, try an approved reference and inspect the resulting code yourself. Check the behaviors the image cannot show, such as keyboard navigation and what happens when a form is submitted.

October activity supports trying it, with a pinned commit

GitHub records a last push of October 9, 2026, and 148 open issues and PRs combined. Recent activity includes September's Windows report and an October evaluation-report PR. The latest-release endpoint returned no published release. Taken together, these facts show continuing repository work without a release tag to use as the default adoption anchor. Pin a commit and assess the changes since the measured snapshot.

Choose Bolt's browser development agent if you need an environment that can run and edit an application while you iterate. Choose tldraw's Make Real starter if drawing and annotating UI on a canvas is the central interaction. Screenshot to Code earns a trial when screenshot reconstruction is the recurring job. Before sharing your instance, resolve the missing backend prerequisite and review the 55 vulnerabilities our audit reported.

Alternatives

ProjectWhat it isPick it when
Bolt.newA browser development agent with an application runtime and code editing.pick this instead when you need to run and revise an application inside the same browser workspace.
Make Real starterA tldraw template that turns selected canvas drawings into interactive HTML.pick this instead when sketching and annotating a UI on a canvas is your main workflow.

Sources

  1. Screenshot to Code README and local setup
  2. Root package scripts
  3. Backend Python and Poetry configuration
  4. Backend testing guide
  5. Windows Playwright startup report, issue 636
  6. Repository metadata and latest push
  7. Bolt.new README
  8. Make Real starter README

More ai tools reviews

universal-modder · DeepEP-Ascend · DeepGEMM-Ascend · hypoarena · jeeves · faster-whisper · the whole board →