Skip to contentBuilt by ion.design

Clone any website.

ditto is an open-source deterministic website cloner. Point it at any site and receive a copy with clean, componentized Next.js or Vite code within 5 minutes.

MIT licensed
ditto://transform
source
Ditto using its Transform move
app/page.tsx
// app/sections/Hero.tsxexport function Hero() {  return (    <section className="relative isolate">      <Nav />      <h1 className="text-balance        text-6xl font-semibold">        Ship faster.      </h1>      <CTA href="/signup">Start</CTA>    </section>  );}

A wild WEBSITE appeared!

Deterministic.

Ditto is fully deterministic. We don't point an LLM at your site and cross our fingers. You get fast, stable, consistent output. We even extract design systems, tokens, fonts, interactions, motion, breakpoints, and sections.

It's the perfect first step for AI app builders: give every new customer a faithful, real-code starting point instead of a blank canvas.

dittodeterministic
Ditto, the cloning slime mascot
Determinism
100
Fidelity
96
Componentized
92
Coverage
88

Three ways to use.

Same deterministic engine underneath. Pick the entry point that fits how you build: roll your own, call the hosted API, or hand it to an agent.

Open source

Self-host · MIT

Clone the cloner. Run the whole pipeline on your own machine, read every line, send a PR.

bash
gh repo clone ion-design/ditto.site
cd ditto.site && npm install
npm run clone -- https://example.com

REST API

Hosted endpoint

Skip the infra. POST a URL, get back a self-contained project. Next.js or Vite, your choice.

bash
curl -X POST https://api.ditto.site/v1/clones \
  -H "Authorization: Bearer $DITTO_KEY" \
  -H "content-type: application/json" \
  -d '{"url":"https://example.com/",
       "options":{"mode":"single","framework":"next","styling":"tailwind"}}'

MCP server

For your agents

Give any agent a cloning tool. Wire ditto into Claude, Cursor, or your own builder loop.

json
{
  "mcpServers": {
    "ditto": {
      "url": "https://api.ditto.site/mcp",
      "headers": {
        "Authorization": "Bearer ${DITTO_KEY}"
      }
    }
  }
}

Code you'd be happy to maintain.

Not one giant file. ditto splits repeated DOM into components, lifts clean regions into sections, extracts an editable content model, and emits a real project. Typed, tokenized, and ready to build on.

generated/apptree
  • app/
  • ·layout.tsx
  • ·page.tsx
  • ·globals.css
  • ·ditto.css
  • ·content.ts
  • components/
  • sections/
  • ditto/
  • svgs/
  • public/assets/cloned/
  • Hover & focus states
  • Dropdown menus
  • Accordions
  • Declarative motion
  • Design tokens
  • Web fonts
  • SEO & metadata
  • JSON-LD & sitemaps
  • Responsive layout

Framework

Next.js · Vite

Styling

Tailwind v4 · CSS

Routes

single · multi-page

Language

TypeScript

ditto-mart · pricingin stock
$0

It's free lol go crazy

Ditto is MIT-licensed and fully open source. Self-host the whole pipeline or hit the hosted API.

Ditto, glowing

It's open source.
Go star it.

ditto is MIT-licensed and built in the open. Use it free, self-host it, read every line, and help shape the deterministic cloner the AI build era runs on.

ion-design/ditto.site1.2k MIT