Como clonar um site com Claude Code (2026): o pipeline real e onde ele falha
Guia para builders sobre clonar site com Claude Code: pipeline agentic em cinco fases, medição no navegador, reconstrução em React e Tailwind editável, setup necessário, casos que quebram sem supervisão e quando usar um clonador hospedado.
Clonar um site com Claude Code não é tirar screenshot nem salvar página. É um pipeline agentic: Claude Code abre uma URL real, mede a página no navegador — CSS calculado, breakpoints, assets — e reconstrói seção por seção como React e Tailwind editável.
O ponto decisivo é medir, não adivinhar. Por isso o resultado é código que você pode editar e rebrandear.
Resumo rápido
| Pergunta | Resposta |
|---|---|
| O que é? | Claude Code mede uma URL e reconstrói como React + Tailwind editável. |
| O que precisa? | Claude Code com acesso ao navegador, modelo forte, Node e prompt ou skill. |
| Uma linha? | Com skill, algo como /clone-website <url>; sem skill, prompt guiado por fases. |
| O que recebo? | Componentes, tokens, espaçamento e breakpoints reais. |
| Onde falha? | Animação pesada, WebGL, fontes comerciais, assets lazy-loaded ou CDN. |
| Dá para pular setup? | Clonesite roda hospedado: URL, preview grátis, clone a partir de $2. |
O que acontece de verdade
Uma URL dá ao agente mais informação que uma imagem. No navegador real, ele lê getComputedStyle(), observa responsividade, baixa assets e enxerga as fontes renderizadas.
Depois transforma essa medição em specs por seção. O build não sai de um prompt gigante; sai de valores observados.
As fases são reconhecimento, base, specs de componentes, build paralelo e montagem com QA visual. A QA é loop, não checklist.
Rodar por conta própria
Você precisa de Claude Code com Chrome ou Playwright MCP, Node e uma skill ou prompt de clone. Templates open-source costumam empacotar esse fluxo em Next.js.
Next.js é ótimo quando é o alvo. Para uma landing page portátil, pode ser scaffold demais. Clonesite retorna uma Vite SPA em React e Tailwind, adaptável a TanStack Start ou outro stack.
Onde quebra
Runs sem supervisão quebram principalmente em:
- animações de scroll, GSAP e WebGL;
- fontes comerciais sem licença de distribuição;
- imagens lazy-loaded ou CDN que viram 404;
- páginas JavaScript-only com pouco HTML;
- páginas atrás de login;
- sites grandes que consomem muitas rodadas de agente.
Isso não torna o clone inútil. Torna o processo um workflow com revisão humana.
DIY ou hospedado
Rodar Claude Code sozinho dá controle, mas você fica com setup, custo de tokens, QA e casos frágeis. Um clonador hospedado assume essas partes, entrega preview gratuita e libera o código quando a página está pronta.
Em ambos os casos, a disciplina é a mesma: manter layout, trocar marca e publicar só quando a página for sua. Depois, aplique as decisões de design para virar marca.
FAQ
O que significa clonar um site com Claude Code?+
Significa apontar Claude Code para uma URL pública, medir a página real no navegador e reconstruí-la como código React e Tailwind editável.
Claude Code consegue clonar qualquer site?+
Ele trabalha com páginas públicas que abrem no navegador. Landing pages simples funcionam melhor; animações pesadas, WebGL, fontes comerciais e assets lazy-loaded costumam exigir revisão humana.
Quanto tempo leva?+
Uma landing page é uma sessão moderada de agente. Um site com muitas seções leva mais. Na Clonesite, um clone hospedado normalmente leva de uma a três horas, com preview gratuita primeiro.
Preciso saber programar?+
Para rodar Claude Code por conta própria, sim. Você instala ferramenta, dá acesso ao navegador, revisa specs e corrige assets. Um cloner hospedado executa essa parte por você.
É legal clonar com Claude Code?+
Sim se o resultado for scaffold: mantenha padrões de layout, mas substitua logos, nomes, copy, imagens e claims antes de publicar.
Guias relacionados
Clonagem de URL vs captura de tela para código: o que muda de fato na saídaA clonagem de URL lê a estrutura real de uma página ativa — DOM, CSS, fontes, links e breakpoints responsivos — e a reconstrói como código editável. A captura de tela para código só enxerga pixels, então infere o layout e perde fontes, links e responsividade. A diferença aparece direto na utilidade da saída.
Melhores clonadores de sites com IA em 2026O melhor clonador de sites com IA é aquele cuja entrada e saída combinam com a sua tarefa — URL para código quando você quer reaproveitar um layout real, captura de tela para código quando só tem um mockup estático, e prompt para site quando vai criar do zero. Compare por tipo de entrada, editabilidade e qualidade de exportação antes de escolher.
Clonar site com API — feito para agentes de IAGuia para desenvolvedores da Clone API da Clonesite via REST ou MCP hospedado. Crie uma API key ou use OAuth para agentes, adicione segredo de webhook só se precisar de callbacks e deixe o agente fazer preflight, criar solicitações, acompanhar status e baixar código React e Tailwind editável.