Como usar IA para criar sites: ChatGPT, Claude e Cursor

Há dois anos, criar um site bonito exigia saber programar ou pagar alguém que soubesse. Hoje, você descreve o que quer em português e uma IA gera o código completo em segundos. Parece mágica, mas é real — e funciona surpreendentemente bem.

Neste guia, vamos ver como usar as principais ferramentas de IA para criar sites, quais prompts funcionam melhor, o que esperar do resultado e como publicar o site final para que qualquer pessoa possa acessar.

As ferramentas disponíveis

Existem várias IAs capazes de gerar sites. Cada uma tem seu ponto forte.

ChatGPT

O mais popular. Você conversa com ele em português, descreve o site que quer e ele gera o HTML completo. Funciona bem tanto no plano gratuito quanto no pago, mas o GPT-4 (pago) gera código mais refinado e com menos erros.

Ponto forte: entende muito bem instruções em português e é ótimo para iterar — você pede ajustes e ele vai refinando.

Claude

Criado pela Anthropic, o Claude é especialmente bom com código. Tende a gerar HTML mais limpo e bem estruturado que o ChatGPT, e lida bem com projetos mais complexos. Também entende português perfeitamente.

Ponto forte: código de alta qualidade, bom senso de design e capacidade de gerar sites mais extensos de uma vez.

Cursor

Cursor é um editor de código com IA integrada. Diferente do ChatGPT e Claude (que são chats), o Cursor é um ambiente completo onde você escreve, edita e visualiza o código em tempo real. A IA sugere mudanças, completa código e refatora automaticamente.

Ponto forte: ideal para quem quer mais controle e pretende fazer ajustes manuais no código.

Bolt e v0

Bolt (da StackBlitz) e v0 (da Vercel) são ferramentas especializadas em gerar interfaces web. Você descreve o que quer e elas geram componentes visuais que você pode editar e exportar.

Ponto forte: interface visual para ver o resultado em tempo real enquanto a IA gera o código.

Prompts que funcionam bem

A qualidade do site que a IA gera depende muito de como você pede. Aqui vão exemplos de prompts que produzem bons resultados:

Prompt básico (funciona, mas genérico)

"Crie um site para minha empresa de fotografia."

Vai gerar algo funcional, mas genérico. A IA vai inventar nome, cores e conteúdo.

Prompt detalhado (resultado muito melhor)

"Crie um site one page responsivo para a fotógrafa Ana Costa. Estilo minimalista, fundo branco com detalhes em dourado (#C9A96E). Seções: hero com título 'Momentos que contam histórias', portfólio com grid de 6 fotos (use placeholders), sobre mim (2 parágrafos sobre experiência com casamentos e ensaios), pacotes (3 cards: Ensaio R$500, Casamento R$3000, Evento R$1500), e contato com WhatsApp (11) 99999-0000. Navegação fixa no topo com scroll suave. Tudo em um único arquivo HTML com CSS embutido."

Esse nível de detalhe produz algo que você pode usar quase direto, com poucos ajustes.

Dicas para prompts melhores

Especifique cores. Em vez de "cores bonitas", diga "fundo #1a1a2e, texto branco, destaques em #e94560". A IA segue à risca.

Descreva a estrutura. Liste as seções na ordem que quer. "Hero, sobre, serviços, depoimentos, contato" é melhor que "faça um site completo".

Mencione o estilo. "Minimalista", "moderno e escuro", "corporativo com tons de azul", "divertido e colorido" — adjetivos ajudam a IA a escolher o visual.

Peça responsividade. Sempre inclua "responsivo" ou "que funcione em mobile" no prompt. A maioria das IAs já faz isso por padrão, mas é bom garantir.

Peça tudo em um arquivo. "Tudo em um único arquivo HTML com CSS e JavaScript embutidos" simplifica a publicação depois.

O que a IA gera

Quando você pede um site para uma IA, ela geralmente produz:

• HTML estruturado com tags semânticas
• CSS para estilização (cores, fontes, layout, responsividade)
• JavaScript para interatividade (menu mobile, scroll suave, animações)

O resultado é um arquivo (ou conjunto de arquivos) que você pode abrir no navegador e ver o site funcionando.

Para a maioria dos projetos simples — portfólios, landing pages, sites de evento, currículos — o resultado é surpreendentemente bom. Profissional o suficiente para usar de verdade.

Limitações que você precisa conhecer

A IA é boa, mas não é perfeita. Alguns pontos para ter em mente:

Design repetitivo. Se você não der instruções visuais detalhadas, os sites gerados tendem a se parecer. As IAs têm "estilos padrão" que se repetem.

Imagens placeholder. A IA não cria imagens reais (a menos que você use uma ferramenta específica de geração de imagens). Ela coloca placeholders ou referências genéricas. Você precisa substituir pelas suas fotos.

Lógica complexa tem limites. Um site informativo com animações? Perfeito. Um sistema com autenticação, banco de dados e pagamentos? Aí já é outro nível — possível, mas exige mais iteração e conhecimento.

Texto genérico. A IA escreve textos razoáveis, mas você deve revisar e personalizar. Seu site precisa ter a sua voz, não a de um robô.

Responsividade imperfeita. Às vezes o layout funciona bem no desktop mas quebra em algum tamanho de tela específico. Sempre teste em mobile.

Como iterar e melhorar

A primeira versão nunca é a final. O segredo é conversar com a IA como faria com um designer:

• "Mude a cor do fundo para preto"
• "Aumente o espaçamento entre as seções"
• "Troque a fonte do título para algo mais elegante"
• "Adicione uma animação de fade-in quando o usuário rolar até cada seção"
• "O menu mobile não está funcionando, corrija"

Cada pedido gera uma nova versão. Em 5 a 10 iterações, você geralmente chega num resultado muito bom.

Uma dica importante: se a conversa ficou longa e a IA começou a "esquecer" detalhes, inicie uma nova conversa colando o código atual e pedindo os ajustes a partir dele.

Exemplo de workflow real

Vamos ver como seria criar e publicar um site do zero usando IA:

Passo 1: Descrever o site. Abra o ChatGPT ou Claude e envie um prompt detalhado descrevendo seu site — estilo, seções, cores, conteúdo.

Passo 2: Receber o código. A IA gera o HTML completo. Copie o código.

Passo 3: Testar localmente. Cole o código num arquivo index.html no seu computador e abra no navegador. Veja como ficou.

Passo 4: Pedir ajustes. Volte à conversa com a IA e peça as mudanças. Repita até ficar satisfeito.

Passo 5: Substituir conteúdo. Troque textos placeholder pelo seu conteúdo real. Adicione suas fotos.

Passo 6: Publicar. Acesse o Htmly, faça upload do arquivo HTML (ou ZIP se tiver imagens) e pronto — seu site está no ar com link público e HTTPS.

Todo esse processo leva de 15 minutos a 1 hora, dependendo de quantos ajustes você quer fazer. Compare com dias ou semanas no método tradicional.

Ferramentas complementares

Além da IA que gera o site, algumas ferramentas ajudam a polir o resultado:

Imagens: Unsplash e Pexels para fotos gratuitas. Para ícones, o Lucide Icons ou Heroicons.

Fontes: Google Fonts — a IA geralmente já inclui, mas você pode trocar.

Compressão de imagens: TinyPNG ou Squoosh para reduzir o tamanho das imagens antes de subir.

Validação: O W3C Validator verifica se seu HTML está correto.

Por que publicar no Htmly

Depois de criar seu site com IA, você precisa de um lugar para hospedar. O Htmly foi feito exatamente para isso:

• Upload em segundos — arraste o arquivo HTML ou ZIP e pronto
• HTTPS automático — seu site já nasce seguro, sem configuração
• Subdomínio gratuito — seusite.htmly.com.br
• Editor visual — faça ajustes direto no navegador, sem precisar voltar para a IA
• Sem servidor para configurar — zero conhecimento técnico necessário

É a ponte entre a IA que cria e a web que publica.

Conclusão

Criar sites com IA não é mais novidade — é o novo padrão para projetos simples. As ferramentas estão maduras, os resultados são profissionais e o processo é acessível para qualquer pessoa, independente de conhecimento técnico.

O fluxo mais eficiente hoje é: descreva o que quer para uma IA, itere até ficar satisfeito e publique no Htmly. Do zero ao site no ar em menos de uma hora.

Se você ainda não experimentou, este é o momento. Abra o ChatGPT ou Claude, descreva o site dos seus sonhos e veja a mágica acontecer.