DEV Community

Usman Haider
Usman Haider

Posted on Originally published at sitelas.com on

How to Clone Any Website with AI in Under 2 Minutes

See a site you like? Hand Claude the URL. The Sitelas connector exposes a capture_url tool that returns a screenshot, a simplified DOM tree, and detected brand tokens — enough for Claude's vision to compose a replica as a fully editable Sitelas site.

How it works end to end

  1. In any Claude chat with the Sitelas connector installed: "Clone https://linear.app for my product landing page."
  2. Claude calls capture_url. A Fly.io-hosted Playwright service loads the target URL, takes a full-page screenshot, and emits a simplified DOM plus extracted color and typography tokens.
  3. Claude's multimodal vision reads the screenshot alongside the DOM. It picks the closest archetype from the 42-template library — usually a SaaS landing template like flagship or nimbus.
  4. Claude calls create_site_from_template with the captured brand overrides, then runs patch_nodes to align copy and structure, and replace_images_from_search for hero imagery.
  5. Result: a Sitelas site at yoursubdomain.sitelas.com with the captured palette, type pairing, and layout — fully editable.

What gets captured

  • Layout structure — header, hero shape, section rhythm, footer.
  • Color palette — primary, accent, background, surface, text.
  • Typography pairing — heading and body families.
  • Heading hierarchy and approximate copy length per section.
  • CTA placement and density.

What doesn't

  • Proprietary images — Claude swaps to stock or generated imagery.
  • Custom animations / JS-only interactions.
  • Backend functionality (forms, auth, databases — those rebuild on Sitelas primitives).
  • Pixel-perfect reproduction — it's a structural recreation, not a copy.

When cloning works best

As a starting point , not a final product. Clone a site you admire, then iterate via chat: "Make the hero taller", "Switch to a warmer palette", "Replace the testimonials with a logo wall". Each follow-up is a patch_fixture or patch_nodes call against the same site.

Editor path

The same capture_url tool is wired into the in-editor AI chat at yourname.sitelas.com/edit. Paste a URL; Gemini composes the replica. Cost: AI credits from your $5 free balance or a $5 top-up.

Legal note

Cloning produces a structural recreation, not a copy. Always replace the captured copy and imagery with your own before publishing — treat the captured site as design inspiration, not a deliverable.

Top comments (0)