🧬

Website Cloning Toolkit

Every verified skill and tool, mapped. Enter hub password to continue.

That's not right. Try again.

🧬 Toolkit Map

How to Clone a Website: The Complete Map

Compiled July 9, 2026 · Every verified skill, tool, and workflow, grouped by the three real jobs · Every repo star count pulled live and confirmed

← Back to Hub
🎯

First: which job do you actually mean?

Start here

"Clone a website" is really three different jobs, and the right tool depends entirely on which one you want:

  • A. Rebuild the design into your own editable code (recreate the look, adapt to your brand). This is the design-to-code / design-extraction job.
  • B. Mirror the whole site as-is for offline reference, archive, or rehosting. This is the download / mirror job.
  • C. AI-generate the code from a screenshot or URL. This overlaps with A but uses AI regenerators that invent new code that resembles the source.

Below, each job gets its own verified toolset, then a recommendation tuned to your stack (Astro + Cloudflare Pages) and your preference for free, self-hostable tools.

⚠️

The one honest truth up front: animation rarely survives

Read this

Across every tool the sweep verified, the single most important distinction is this:

Regenerate vs copy-the-source

AI regenerators (v0, Anima, screenshot-to-code, the Claude cloner templates) look at the site and write new code that resembles it. They invent plausible layout and often invent new animations. Result: "looks similar," not "is the same." Real motion, scroll effects, and JS behavior do not carry over.

Source copiers (Firecrawl, browser Save-As, wget) pull the actual HTML/CSS/JS. This is the only way real animation and interactivity survive, because you keep the real code. The tradeoff: you inherit the source's messy production code, not clean components.

The one AI tool that even attempts motion is abi/screenshot-to-code, which accepts a screen recording (not just a still) and tries to rebuild the interaction. Still approximate. If faithful animation is the goal, copy the source; don't regenerate.

🤖

Job A1: Clone from inside Claude Code (skills you can install)

Design → code

These run in Claude Code using your own subscription (free to run). All star counts verified live July 9, 2026.

SkillStarsWhat it doesClonesAnimation
ai-website-cloner-template 27,000+★ One command /clone-website <url> drives Chrome to read the real DOM + computed styles, then parallel builder agents rebuild it with a visual-diff check. The most serious full cloner in the ecosystem. Full site → Next.js/React/Tailwind Flattens
claude-skill-web-clone 590★ "Real source first" method: reuses the actual site markup instead of hallucinating code. Only one explicitly claiming React + WebGL handling. Full site, code-fidelity Better
taste-skill 218★ /taste <url> outputs a design profile (.md + .json) capturing tokens AND the design rationale (the why behind them). Design language only No
anydesign 128★ Reads images, URLs, or Figma, emits a structured design.md with tokens + component inventory. Most flexible on input source. Design → spec No
ui-cloner installed 1★ Chrome-based "clone any site and adapt to your brand." You just installed and tested this one. Inert markdown, unvetted author, but free to run. Design + layout + attempts animation Attempts
extract-design-system installed 119★ URL to W3C design tokens (tokens.json + tokens.css). Clean, proven, actively maintained. Tokens only No

Catalogs to keep harvesting: davila7 templates, awesome-claude-code-and-skills. Flagged unverifiable: "Manavarya09/design-extract" (heavy SEO presence but 404s on the GitHub API right now, do not install).

🎨

Job A2: AI design-to-code tools (outside Claude)

URL/screenshot → code

Open-source / self-hostable (your preferred lane):

ToolPriceInputOutputNote
Firecrawl installed OSS / free URL Real HTML + markdown + JSON + screenshot The faithful path: gives you the true source, so real animation survives. Code is production spaghetti, not tidy. You already have the skills + MCP.
abi/screenshot-to-code OSS / self-host Screenshot, Figma, screen recording HTML/Tailwind, React, Vue, Bootstrap 73k★. Best OSS regenerator; the only one that attempts motion via screen-recording. Bring your own model key.
Dembrandt OSS npm / free URL DTCG tokens, Tailwind config, DESIGN.md, MCP npm i -g dembrandt. Best free brand-token extractor (tested + security-clean), works natively with Claude Code. Caveat from our run: over-promotes neutrals (labeled gray as "primary") and mis-guessed the framework. Trust its tokens, not its role labels.
Project Wallace / CSS Stats Free URL / CSS CSS analytics + token audit Analysis only, not a rebuild. Good precursor to hand tokens to a builder.

Hosted SaaS (best-looking output, but reinterprets rather than copies):

ToolPriceInputOutputNote
v0 (Vercel) Prompt, screenshot, URL React + Tailwind + shadcn Best-looking, most production-ready output. Invents its own animations. Not self-hostable.
Anima Figma, image, URL React, HTML, Vue, Tailwind One of few with an explicit URL "clone website" button. Good layout, invents interactivity.
Builder.io Visual Copilot Figma React, Vue, Svelte, Angular, HTML Cleanest, most codebase-ready output. Figma-first, so pair with html.to.design to turn a URL into Figma first.
html.to.design URL Editable Figma layers The bridge: URL → Figma → any Figma-to-code tool. Static snapshot.
💾

Job B: Mirror the whole site (offline / archive / rehost)

Download

All free and Windows-friendly unless noted. This is about downloading the real pages + assets, not rebuilding.

ToolBest forAccessJS/SPA?
wget --mirror Static sites, zero install Already on your machine (git bash) No JS
HTTrack Static sites, friendly GUI winget install HTTrack.WinHTTrack No JS
SingleFile CLI Faithful single JS-rendered page npm i -g single-file-cli Yes (real browser)
Firecrawl installed Whole JS site → clean HTML/markdown, from inside Claude firecrawl:firecrawl-download / -crawl Yes (renders JS)
Browsertrix Crawler True interactive replay (WACZ) Docker Desktop Yes (highest fidelity)
monolith / obelisk One self-contained HTML file winget install Y2Z.Monolith No JS alone

What to actually reach for (tuned to your stack)

Recommendation

The free, autonomous trio you already own

1. Firecrawl (installed) to pull the site's real HTML/CSS/JS + a screenshot.
2. Dembrandt (npm i -g dembrandt, free) to lock the exact brand tokens.
3. Claude Code (your ui-cloner or extract-design-system skill) to rebuild it into your own Astro components.

100% free, runs on your subscription, and produces cleaner-than-copy results you can actually adapt.

If you want a turnkey full clone and don't mind budget + porting: JCodesMore's ai-website-cloner-template (27k★) is the best in class, but it outputs Next.js (you're on Astro, so it needs porting) and costs roughly $5 to $30 per clone in model tokens.

If you just need the design language to inform your own build (the safest and honestly highest-quality play): taste-skill or Dembrandt to extract tokens + rationale, then build fresh in your voice.

⚖️

The copyright reality (plain, not a lecture)

Worth knowing

Cloning a third party's site wholesale copies their copyrighted content and usually breaks their Terms of Service. Trade-dress and copyright claims are real if you republish someone else's look-and-feel.

Low risk: mirroring for private/offline reference, and extracting tokens + layout patterns to inform your own original build.

High risk: pixel-copying a competitor's site and rehosting it publicly. Respect robots.txt, don't hammer servers, and when in doubt, extract-and-adapt rather than copy.

Compiled July 9, 2026 · Private · All repos verified live via GitHub API · ← Hub