shot2code

Turn the reference you have into an editable web project — on your own machine.

Latest release

shot2code is a Windows desktop app. Start with screenshots, a public website's computed design, Figma assets, a direct Google Stitch project, a GitHub frontend, a description or a recording, then edit, version, refine and export the result. Stitch can open directly without a second model call; generation runs from your machine against the provider you configure. Project history and normalized imported assets stay local, while credentials go only to the integration they belong to.

Product site Downloads Install User guide Input tabs FAQ Troubleshooting

Source code, issues about the code itself, and the upstream release notes live in the project repository: https://github.com/ArasaniRohithReddy/shot2code. This hub is where the Windows builds and their documentation are published.

What you need

Without a provider, generation fails fast and says so. The app does not ship a model and cannot generate anything on its own.

Signing in to GitHub Copilot needs nothing installed: the desktop app runs its own GitHub OAuth device flow, shows a one-time code and opens your browser. The gh auth login / copilot ladder and a pasted token still work.

The seven input tabs

Every screenshot below comes from the current packaged app. The input-tab guide explains prerequisites, limits, privacy and output for each path.

Built Storybook is visible inside Import as its own inert metadata path:

Current integrations and history

What you can do

Output stacks

HTML + Tailwind · HTML + CSS · React + Tailwind · Vue + Tailwind · Bootstrap · Ionic + Tailwind · Alpine.js + Tailwind · Preact + Tailwind · Tailwind + daisyUI · Bulma · Material 3 · htmx + Tailwind

Each stack has an explicit single-HTML and project-folder export strategy, so the download builds rather than being a plausible-looking scaffold. See USER-GUIDE.md.

Model providers

All of these support model selection: tick as many models as you like in Settings → Models or in the picker beside the composer, and each run produces one option per selected model, up to the per-run limit. Tick nothing to leave it automatic. See USER-GUIDE.md.

BYOK is a separate connection, not a replacement. It carries its own API key or bearer token — the direct OpenAI and Anthropic keys are never borrowed for it — and only an OpenAI-compatible endpoint on localhost may run without a credential. Its models appear under Copilot SDK (BYOK) with the run identity sdk-byok/<provider>/<base model>, so a model and its BYOK twin can run in the same generation and be compared. Configuring it changes nothing about how the native providers behave. The Configure local Ollama action fills http://localhost:11434/v1 on this same connection. shot2code does not bundle Ollama or a model; local inference uses your hardware, model licences and capabilities vary, and Ollama cloud services are separate. See Ollama's OpenAI-compatibility documentation and USER-GUIDE.md.

It also reaches models the catalogue does not know. Name the ids your endpoint serves — discovered from its /models route where one exists, typed by hand otherwise — and each becomes a single honest option, <model> via <provider>, with the identity sdk-byok/<provider>/custom/<model> carried through History and retries. One connection can offer several such models, and they can run side by side in the same generation. The wire API is chosen automatically: Chat Completions for an endpoint with its own base URL, Responses for a provider's own. Any such model must support image input and tool calling, which only the endpoint's documentation can confirm.

Test before you generate. Connection checks under the API keys test OpenAI, Anthropic, Gemini and Replicate individually with one minimal request, so an unpaid account or a revoked key is reported — with the action that fixes it — before a generation is half-finished.

MCP servers, skills and web research

Up to eight Model Context Protocol servers can be configured in Settings over stdio, HTTP or SSE, either by hand or from the official MCP Registry browser. A server must be enabled and explicitly trusted before shot2code starts it, remains read-only until Allow write tools is enabled, and is launched without a shell. Registry and featured Google Stitch entries arrive as disabled, untrusted drafts. Figma MCP endpoints are filtered because Figma accepts only clients listed in its MCP Catalog.

Agent Skills are local/public-GitHub instruction folders. They are validated, stored with provenance and disabled by default. Their script files remain inert resources because shot2code exposes no shell or unrestricted host-filesystem tool.

MCP tools and Agent Skills are available only to GitHub Copilot subscription and Copilot SDK BYOK variants. Native OpenAI, Anthropic and Gemini variants never receive them. MCP write access is separately visible and consented.

The Tools control beside Chat is an inventory, not a bypass. It reports project editing, Chromium preview verification, web search, bounded page reading, public-domain photos, generated-image readiness and provider billing, localized icons, valid enabled+trusted MCP servers (including write scope), and enabled Skills. Merely appearing in the list enables nothing; Manage tools opens the relevant Settings consent.

Provider-neutral research tools are different from MCP/Skills:

• search_web sends bounded queries to Tavily or Exa from every runtime and returns capped untrusted snippets. Provider allowances belong to those services and can change; the app links their official pricing pages.
• read_web_page has a separate off-by-default switch. It accepts one public HTTP(S) URL on a standard port, no credentials or query string, sends no cookies/auth, downloads at most 512 KB, strips active HTML, returns at most 16,000 untrusted characters, and allows two reads per turn and five per generation. Turning on search never turns on page reading.
• search_icons is another separate opt-in available to every runtime. It uses only https://api.iconify.design, sanitizes and locally persists selected SVG, restricts automatic results to a permissive SPDX allowlist, and embeds source, author, licence and retrieval provenance. Iconify's public API currently accepts keyless requests (checked 2026-10-04), but publishes no fixed public quota or SLA, so access can change. Verify upstream metadata and brand/trademark rights. See the Iconify API docs.

Copilot's built-in search is used only when canonical search is unavailable. The runtime-owned built-in web_fetch remains blocked: its whole-page result reaches the model before shot2code can truncate, label or budget it, so it is never a fallback for read_web_page. See the tool-safety guide.

Design sources: Figma, Storybook and Google Stitch

Besides screenshots, a URL, a description or a recording, shot2code can start from a design tool:

Both credentials are capture-only. The Figma token is sent to api.figma.com and nowhere else, the Stitch key reaches only the bundled SDK, and neither is included in a generation request, in project history or in an export. Figma's desktop and hosted MCP servers admit only clients in Figma's own catalogue, and shot2code does not impersonate another editor — REST/PAT is the supported programmatic route. @google/stitch-sdk is published by Google Labs and is explicitly not an officially supported Google product.

Imported design/repository images are persisted under shot2code's local asset store and referenced through restart-safe identifiers. Binary project files remain previewable and export as decoded bytes rather than base64 text. Every external design document, website string and repository file is untrusted data, never an instruction source.

Image generation, public-domain photos and icons

Image generation is additive and provider-specific:

• Replicate is the default-compatible provider and the only one used for background removal. Curated models declare their own input shape; a custom model is accepted only after its published schema proves a string prompt and image output with no extra required inputs.
• Cloudflare Workers AI uses its own account id/token.
• OpenAI-compatible images use a dedicated endpoint/key and expose editing only when /images/edits actually exists.

Every prompt keeps its own success or classified failure. Partial batches report Generated X of N; an all-failed batch fails instead of returning empty image URLs. After a credential, billing, quota, permission, model or configuration failure, a per-generation circuit breaker blocks repeated paid/provider calls. The run is directed to another honest asset path — public-domain photos, localized icons, extracted assets, CSS or SVG — or the user fixes Settings and starts a new generation.

Free image search is a separate, opt-in Openverse tool. It does not silently replace generation. Only CC0/Public Domain Mark records with a source and licence URL survive local checks, and selected images are downloaded through DNS/private-address, redirect, MIME, byte and decoded-pixel limits before being stored locally. Openverse aggregates third-party metadata, so verify the source. The public API currently works without a shot2code credential, but provider access and limits can change.

Arbitrary Google, Bing or general web-image results are deliberately not inserted into exported projects: appearing in a search result grants no reuse right. Use Openverse for conservatively licensed photography and the opt-in Iconify path for interface icons. Iconify SVG is sanitized and localized rather than hotlinked; its embedded provenance does not grant trademark rights for a brand icon.

Reviewing what was generated

Review renders the generated page at two to four real CSS widths — 1440, 768 and 390 by default, any whole width from 320 to 1920 — and combines a local source audit with bounded runtime evidence from each sandboxed frame. Runtime checks cover horizontal overflow, accessible names, custom keyboard focus, target-size advisories, image alternatives/load failures, headings and main landmarks; a failed frame is isolated so source and other viewport results stay usable.

Findings carry Accessibility, Structure, Responsive or Document categories, source/runtime provenance and viewport evidence. Severity/category/query filters plus filtered select-all preserve hidden selections. The health summary states whether coverage is healthy, needs attention, partial or stale and binds the result to the exact version, option, source hash and viewport set.

Selected fixes target that exact reviewed option. The optional AI review uses the recorded model with no tools, MCP, Skills, web search or writes and may consume provider quota; local findings remain authoritative. Schema-v2 JSON reports include findings, coverage and safe relative file labels, never source credentials. The Design Inspector still exports DESIGN.md, SKILL.md and a palette PNG.

These are automated source and bounded runtime signals, not WCAG certification. Manual keyboard, screen-reader, zoom and interaction testing is still required. See USER-GUIDE.md.

What it does not do

• It is not a hosted service and has no account, sync or cloud storage.
• It does not include a model or a provider allowance. A local Ollama run can avoid a paid inference API, but Ollama, hardware and a suitably licensed/capable model remain yours to install and operate.
• It does not run a shell, and it exposes no unrestricted host-filesystem tool. An imported skill may ship scripts; they are stored, never executed.
• It does not guarantee that generated code is correct, accessible or secure. It is model output: review it before running it outside the sandboxed preview.
• The published Windows binaries are not code-signed, so SmartScreen will warn on first run. Verify the SHA-256 checksum instead — see SECURITY.md.

Documentation

Bugs and ideas belong in this hub — open an issue and pick shot2code. Vulnerabilities are reported privately. The hub's support policy covers triage for every product published here.

License

The application is MIT-licensed in its source repository. The documentation and release assets in this hub are provided under the MIT License. Components that ship inside the app — Electron and Chromium, the frozen Python runtime, the headless browser — are listed in THIRD-PARTY-NOTICES.md.