Skip to content

Clone any website.

ditto the builder is a tiny internet creature that builds websites. Show Ditto a site and it rebuilds it. Next.js or Vite code within 5 minutes.

Follow on XGet API key
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> );}

It's super effective. Clean code emitted.

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.

Hosted API

Self-host

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

bash
gh repo clone ion-design/ditto.builders
cd ditto.builders && npm install
npm run clone -- https://example.com
Follow on X

REST API

Hosted endpoint

Skip the infra. POST a URL, poll the job to done, pull the project. Watch real progress stream by — capture, generate, verify. Next.js or Vite, your choice.

bash
curl -X POST https://api.ditto.builders/v1/clones \
 -H "Authorization: Bearer $DITTO_API_KEY" \
 -H "content-type: application/json" \
 -d '{"url":"https://example.com/",
  "options":{"mode":"single","framework":"next","styling":"tailwind"}}'
# -> 202 { "jobId": "...", "status": "queued" }
# follow the pipeline live, then grab the result
curl https://api.ditto.builders/v1/clones/$JOB/events?after=0 \
 -H "Authorization: Bearer $DITTO_API_KEY"
Get API key

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.builders/mcp",
  "headers": {
  "Authorization": "Bearer ${DITTO_API_KEY}"
  }
 }
 }
}
Get API 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.tsxmetadata · fonts · shell
  • ·page.tsxreconstructed render tree
  • ·globals.cssreset · tokens · tailwind
  • ·ditto.csskeyframes · pseudo-elements
  • ·content.tseditable semantic data
  • ▸components/repeated DOM, extracted
  • ▸sections/clean page regions
  • ▸ditto/dropdown & motion recipes
  • ▸svgs/hoisted inline SVG
  • ▸public/assets/cloned/fonts · images · manifest
  • 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 tiny and free. Self-host the whole pipeline or hit the hosted API.

Get API key
Ditto, glowing

It's open.
X / dittobuilders

ditto the builder is tiny, free, and built in the open. Self-host it, read every line, and help shape the deterministic cloner the AI build era runs on.

Follow on XX / dittobuilders
ion-design/ditto.builders95 MIT

$DITTO Token

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
Coming Soon