HTML pronto no Claude, mas ninguém te ensinou o passo seguinte: colocar ele no ar

Você pediu pro Claude fazer um infográfico, um comparativo, uma peça com dado preciso. Ele fez, e o resultado apareceu ali mesmo na conversa, bonito, com o texto certinho. Só que ele fica preso ali. Ninguém além de você consegue ver, não tem link pra mandar no grupo, não vira nada fora daquela tela. Falta um passo que a maioria nunca aprendeu: pegar aquele arquivo e colocar ele de verdade na internet, com um endereço próprio que qualquer pessoa abre. Esse passo existe, é simples, e é o que fecha este guia.

Por que HTML e não uma imagem pronta

Rápido, pra quem não leu o artigo anterior: quando você pede uma imagem pra um gerador comum, ele desenha o texto como um traço, um formato visual. É por isso que letra, número e nome próprio às vezes saem embolados ou trocados. HTML não desenha texto, ele escreve texto de verdade, o mesmo tipo de caractere que forma esta frase. Por isso o Claude consegue montar peças com texto preciso (infográfico, carrossel de dados, comparativo lado a lado) sem errar uma letra. A diferença entre esse HTML e uma imagem comum é que ele não é uma foto pronta, é um arquivo que um navegador sabe ler e montar na tela. Isso é o que torna possível publicar ele como site de verdade.

Como pedir o HTML certo pro Claude

Três formatos costumam sair bem quando você pede em HTML:

Infográfico. Você descreve os dados ou cola um texto bruto e pede pro Claude organizar visualmente, com títulos, números em destaque e hierarquia clara.

Carrossel de dados. Uma sequência de cartões, cada um com um dado ou argumento, pensado pra ser lido em blocos, não num parágrafo corrido.

Comparativo lado a lado. Duas ou três colunas comparando opções, preço, característica, prós e contras.

Nos três casos, o pedido que funciona melhor é carregar uma imagem parecida com o que você imagina e escrever algo como "faz algo assim, em HTML, sobre [assunto]". A imagem de referência guia o layout, o HTML garante que o texto sai certo.

Como ver o resultado antes de publicar qualquer coisa

Assim que o Claude termina, ele mostra o HTML já renderizado ali na própria conversa, como se fosse a página funcionando. Você rola, olha as cores, confere se o texto está certo, pede ajuste se precisar. Nada disso ainda está na internet, é só uma pré-visualização dentro do chat. Só depois de aprovar esse resultado é que vale a pena seguir pro próximo passo.

Como publicar esse HTML de verdade na internet, com o Vercel

Esta é a parte que faz o arquivo sair do Claude e ganhar um endereço próprio que qualquer pessoa consegue abrir, mesmo sem ter conversado com o Claude. Existem dois caminhos pra chegar lá. Você não precisa saber os dois, só escolher um, conforme o plano do Claude que você usa hoje.

Método 1: pedir pro próprio Claude publicar (mais rápido)

Depois de um ajuste único, é o próprio Claude que publica pra você, sem você precisar baixar nem arrastar arquivo nenhum. Esse método exige um plano pago do Claude (Pro, Max, Team ou Enterprise), não está disponível no Claude Free.

A Vercel tem um conector oficial que se conecta direto no Claude. Uma vez ligado, o Claude ganha a capacidade de publicar código sozinho, dentro da própria conversa.

Passo 1: conectar o Vercel ao Claude (faz uma vez só)

No Claude.ai ou Claude Desktop, vá em Settings (Configurações).
Clique em Connectors.
Clique em "Add custom connector".
Dê o nome "Vercel" e cole a URL https://mcp.vercel.com.
Autorize a conexão fazendo login na sua conta Vercel (ou criando uma, é gratuito).

Pronto, essa parte não precisa ser repetida. O Claude fica com acesso à Vercel em qualquer conversa daqui pra frente.

Passo 2: pedir pro Claude publicar

Na mesma conversa onde o Claude gerou o HTML (ou em qualquer conversa nova, apontando pro arquivo), basta pedir algo como "publica esse HTML no Vercel" ou "sobe isso pro ar". O Claude cuida do resto sozinho: cria o projeto, detecta o que precisa, faz o build, e devolve um link ao vivo, funcionando, que qualquer pessoa pode abrir em qualquer lugar do mundo. O build roda em segundo plano enquanto você espera a resposta.

Esse conector está disponível nos planos Pro, Max, Team e Enterprise do Claude. Não está no plano gratuito. Se você usa o Claude Free, esse passo específico não aparece nas suas opções de Connectors, pule pro Método 2 abaixo.

Método 2: publicar direto no site da Vercel (funciona em qualquer plano)

Se você usa o Claude Free, ou simplesmente prefere não conectar nada, dá pra publicar o mesmo HTML manualmente, sem precisar de plano pago em lugar nenhum. Só uma conta gratuita na Vercel.

Baixe o arquivo HTML que o Claude gerou (salve ele no computador, com extensão .html).
Acesse vercel.com/drop no navegador.
Arraste o arquivo pra área indicada na página (ou clique pra escolher o arquivo manualmente, se preferir).
Se ainda não tiver conta na Vercel, faça login ou crie uma, é gratuito.
Dê um nome ao projeto quando a página pedir.
Confirme a publicação.

Em poucos segundos a Vercel devolve um link ao vivo, do mesmo jeito que o Método 1, só que com um passo manual de download e arrasto no lugar do pedido direto ao Claude.

Perguntas frequentes

Preciso saber programar?

Não. Em nenhum dos dois métodos você escreve código. No Método 1 o Claude publica sozinho depois da conexão. No Método 2 você só baixa o arquivo e arrasta ele na página da Vercel.

Preciso de algum plano específico?

Depende do método. O Método 1 (conector no Claude) exige plano pago (Pro, Max, Team ou Enterprise), não está no Claude Free. O Método 2 (Vercel Drop) não exige nada além de uma conta gratuita na Vercel, funciona em qualquer plano do Claude, inclusive o Free.

Dá pra usar meu próprio domínio depois?

Sim, o Vercel permite conectar um domínio próprio a um projeto já publicado. Isso é um passo extra, feito depois que a página já está no ar com o endereço padrão do Vercel, e vale um guia próprio se você quiser aprofundar nesse ponto mais na frente.