CopySite
Back to blog

How AI website cloning works

From URL or screenshot to editable React — the capture, generation, diff, and publish pipeline behind CopySite AI cloning.

Jun 18, 2026CopySite AI TeamCopySite AI Team

Cloning a site with CopySite AI means rebuilding a comparable structure and visual style as clean, editable code — not copying assets, brand IP, or copyrighted material. Here's how the pipeline works end to end.

1. Capture

  • URL — we fetch the page, extract a structured outline (sections, headings, nav, images-as-text, color hints), and take a screenshot for the agent to look at. SSRF protection means internal/private addresses are rejected before any request leaves.
  • Screenshot — you drop an image. We pass it directly to a vision-capable model along with a generation brief.

The capture is summarized into a source context: a compact description of what the page is and how it's laid out. The agent never receives the original HTML verbatim — it receives an interpretation.

2. Generate

The source context plus your skill choice (landing, dashboard, portfolio, store) goes into a coding agent running in a sandbox. The agent writes real React + Tailwind files: a sensible component tree, responsive layout, themed tokens, placeholder copy and imagery. It aims for the feel and structure of the source, produced from scratch.

3. Diff & preview

Each generation is stored as a snapshot. You get:

  • A live preview of the generated site.
  • A file-by-file diff against the previous snapshot.
  • A visual comparison side by side with the source screenshot, so you can see what landed and what to refine.

Don't like a change? Roll back to any prior snapshot. The full history is preserved per project.

4. Refine in chat

The first pass is a draft. From there you iterate in plain language: "tighten the hero spacing," "swap the palette to indigo," "add a contact form." Each message produces a new snapshot and a new diff, so every step is auditable.

5. Publish & export

When it's ready:

  • Export as a zip, or push to GitHub.
  • Deploy to the edge with one click.
  • The generated code is yours — standard, portable, no lock-in.

A note on rights

You are responsible for making sure you have the rights to rebuild from any source you provide. CopySite AI is a tool for recreating structure and style with original code; it's not a way to reproduce someone else's protected assets. Use it to learn, to prototype, to rebuild your own site in a new stack — and keep it on the right side of IP.