Stitch Loop skill

O Claude gera cada página no Stitch, encaixa no site com a navegação ligada e deixa escrito qual é a próxima, pro ciclo continuar.

por Google LabsPublicada pela própria empresa

instalações: 56,4 mil
estrelas no GitHub: 8.594
No skills.sh desde: janeiro de 2026
Licença: Apache-2.0

Atualizada no GitHub em 17 de agosto de 2026. Dados conferidos em 26 de outubro de 2026, no skills.sh e no GitHub.

Google Labs
stitch-loop
O Claude gera cada página no Stitch, encaixa no site com a navegação ligada e deixa escrito qual é a próxima, pro ciclo continuar.OficialAuditada56,4 mil instalações, grátis

O que ela faz

Usa um arquivo de bastão, .stitch/next-prompt.md, com o nome da próxima página e o prompt dela. Em cada rodada o agente lê o bastão, consulta o SITE.md (visão do site, mapa de páginas e roteiro) e o DESIGN.md (o estilo visual) e gera a tela no Stitch pelo servidor MCP.

Baixa o HTML e a imagem da tela, move a página pra site/public, ajusta os caminhos dos arquivos e liga os links vazios da navegação. Se tiver o Chrome DevTools MCP, abre a página num servidor local e compara com a imagem do Stitch. Guarda os ids do projeto em .stitch/metadata.json.

No fim marca a página como feita no SITE.md e escreve o próximo bastão, tirando a tarefa do roteiro ou de uma lista de ideias. Não recria página que já existe e sempre copia o bloco do design system no prompt, pra todas as páginas saírem com o mesmo visual.

Nas palavras de quem fez

Teaches agents to iteratively build websites using Stitch with an autonomous baton-passing loop pattern…

Google Labs, no SKILL.md

Quando usar

Montar um site de várias páginas com o mesmo visual
Deixar o agente criando páginas em sequência enquanto você revisa cada uma
Levar pro seu projeto, em HTML, as telas que o Stitch gera
Continuar pelo roteiro um site que parou no meio

Depois de instalar, é só pedir assim

Roda o stitch-loop: gera a página que está no next-prompt e prepara a próxima
Gera no Stitch a página de preços do meu site, coloca em site/public e liga no menu
Continua o site do meu restaurante pelo roteiro do SITE.md até a página de contato

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

Gen Agent Trust HubPassou
SocketPassou
SnykPassou

Perguntas

Como instalar a Stitch Loop no Claude Code?

Toca em Levar, aqui nesta página, e deixa seu nome, e-mail e WhatsApp (é uma vez só). Aparece uma frase pronta: cola ela no Claude Code, que ele mesmo instala a Stitch Loop, e a skill passa a valer na próxima conversa. A mesma frase serve no Codex. Se preferir fazer na mão, o passo a passo está em como instalar skills no Claude Code.

O que precisa pra funcionar?

O servidor MCP do Stitch configurado no agente, com as credenciais que o guia do Stitch pede, um projeto no Stitch (ela cria se não tiver) e os arquivos .stitch/DESIGN.md e .stitch/SITE.md. O DESIGN.md sai da skill design-md, do mesmo repositório. O Chrome DevTools MCP é opcional, só pra conferir o visual.

Roda no Codex e no Antigravity?

Sim. O repositório lista o Codex e o Antigravity entre os agentes compatíveis, desde que o MCP do Stitch esteja conectado. O ciclo pode ser tocado à mão, com você revisando cada rodada, por outro agente ou pelo GitHub Actions.

Ela faz site com login ou pagamento?

Não. As páginas saem como HTML estático em site/public. Formulário que grava dados, login e pagamento ficam fora dela.

Levar essa skill

1x stitch-loopR$ 0,00

TotalR$ 0,00

Levar precisa do JavaScript ligado. O código da skill está no GitHub: github.com/google-labs-code/stitch-skills

Aprenda a usar

Criar site com IA: o passo a passo no Claude Code
Como eu crio site com IA pros clientes sem saber programar: no Claude Code, no Codex ou de graça no Antigravity. O passo a passo, sem cara de template.