Chat com IA

O chat com IA cria e altera seu site a partir de uma conversa. Descreva o que você quer, e a IA lê seu código, faz as alterações e atualiza a área de edição conforme avança.

Como abrir o chat

• Clique em Assistente de IA na barra lateral esquerda.
• Pressione ⌘K / Ctrl+K sem nada selecionado.
• Com um elemento selecionado, ⌘K / Ctrl+K abre a barra Editar com IA. Escolha a opção Perguntar à IA para enviar seu pedido ao chat com esse elemento anexado.

Como enviar uma mensagem

Digite na caixa Perguntar ao WebTwizz e pressione Enter para enviar. Pressione Shift+Enter para inserir uma nova linha.

Enquanto a IA trabalha, o botão de envio vira um botão Parar. Clique nele para interromper a execução, e o chat mostra Resposta interrompida.

Depois de uma resposta, algumas sugestões de próximos passos podem aparecer acima da caixa. Clique em uma para colocá-la na caixa e então edite ou envie como está.

Modos

O botão de modo ao lado de + define como a IA trabalha na sua próxima mensagem.

Modo	O que faz
Automático	O padrão. Escolhe o modelo para cada mensagem. A criação inicial de um site geralmente usa o modelo mais avançado, assim como funcionalidades grandes e correções de algo que não funciona. Edições do dia a dia usam o modelo padrão. Uma pergunta simples é respondida sem alterar nada.
Normal	Cria e edita seu site com o modelo padrão.
Max	Usa o modelo mais avançado em todas as mensagens. Ele analisa mais a fundo, lida com criações grandes e erros difíceis, e usa mais créditos que o Normal.
Chat	Converse e planeje. A IA lê seu código, faz capturas de tela, verifica erros e pesquisa na web, mas não pode alterar seu site. As respostas do Chat usam menos créditos do que a criação.

Você só paga pelo modelo que realmente foi usado. Assim, uma mensagem no modo Automático que usou o modelo padrão custa a tarifa padrão.

No modo Chat, depois de definir um plano, mude para Automático, Normal ou Max e peça à IA para executá-lo. O modo escolhido fica salvo para cada site no seu navegador. A caixa de prompt no painel oferece Automático, Normal e Max para a criação inicial de um site.

Habilidades, MCP e modos: digite /

Digite / na caixa para acessar opções que orientam sua mensagem. Continue digitando para filtrar e pressione Enter ou clique para escolher.

• Habilidades: instruções reutilizáveis para um tipo de tarefa, como criar um painel ou escrever textos melhores. Uma habilidade aparece na sua mensagem como uma etiqueta, e você pode anexar até 4. Salvar como habilidade transforma o que você pediu neste chat em uma nova habilidade. Veja Habilidades.
• MCP: cada servidor MCP ou app conectado a este site. Abra um para ver suas ferramentas e escolha uma ferramenta para dizer à IA que a use nesta mensagem. Adicionar um servidor MCP abre a tela para conectar um pelo link.
• Esta mensagem: Chat responde apenas a esta mensagem sem alterar nada, e Max a executa no modelo mais avançado. O modo do restante do chat continua como estava.
• Memória: Lembrar salva uma nota que a IA mantém em todos os chats deste site. Digite a nota depois de /remember e pressione Enter. Esquecer remove uma nota.

Ações do site como publicar, desfazer e acessar o histórico de versões têm seus próprios atalhos de teclado.

Menções: digite @

Digite @ para indicar algo à IA, para que ela saiba exatamente a que você se refere. Continue digitando para pesquisar tudo de uma vez. O item escolhido aparece na mensagem como uma etiqueta, assim como uma habilidade. Exclua a etiqueta para removê-lo.

Você pode mencionar	O que a IA faz com isso
Um serviço conectado, como Stripe ou Notion	Usa esse serviço para atender ao seu pedido
Uma seção desta página ou uma página	Trabalha nessa parte do site
Uma tabela de dados	Examina suas colunas e algumas linhas
Outro chat deste site	Lê o que foi dito e decidido lá
Uma versão	Examina o site como ele era naquele momento
Algo que a IA criou, como um documento	Abre o item
Um dos seus outros sites	Lê seus arquivos, sem alterá-lo nem copiar nada

As menções ficam vinculadas ao chat. Assim, uma mensagem como "agora faça o mesmo no rodapé dele" ainda mantém o contexto. As listas são carregadas sempre que você as abre, então um serviço, chat ou tabela que você acabou de adicionar já aparece nelas.

Anexos

Clique em + para adicionar algo à sua mensagem:

• Enviar imagem: uma captura de tela, um design para seguir ou uma imagem, como seu logotipo, para a IA colocar no site.
• Enviar arquivo: código, documentos, planilhas e PDFs de até 20MB, ou um .zip de até 100MB.
• Selecionar elemento: indique algo na área de edição (veja abaixo).
• Mencionar e Habilidades e MCP: os mesmos menus que aparecem ao digitar @ e /.

No celular, + abre um painel, e Mencionar e Habilidades e MCP são a forma mais rápida de acessar os dois menus sem procurar @ e / no teclado.

Você também pode arrastar arquivos para a caixa ou colar uma imagem.

Como indicar um elemento

Escolha Selecionar elemento e clique em um elemento na área de edição. Uma etiqueta na caixa mostra o arquivo e os números das linhas, para que a IA saiba exatamente a que você se refere. Clique em × na etiqueta para removê-la.

Melhorar e ditar

• A lâmpada (Melhorar prompt) reescreve sua mensagem com mais detalhes antes de você enviá-la.
• O microfone (Entrada por voz) permite falar em vez de digitar. Clique novamente para parar. Ele aparece em navegadores que oferecem entrada por voz.

Como acompanhar o trabalho

A área de edição é atualizada em tempo real enquanto a IA trabalha, e o chat mostra o que ela está fazendo em linhas simples.

• Cada etapa tem seu próprio painel. Durante a execução, você vê linhas como "Lendo page.tsx" ou "Escrevendo Hero.tsx". Quando a etapa termina, o painel se recolhe em uma linha como "3 arquivos editados · 5 arquivos lidos · 1 comando executado", com as linhas adicionadas e removidas. Clique na linha para abri-lo novamente.
• As linhas de arquivos mostram Criado ou Editado, o nome do arquivo e as linhas adicionadas e removidas, como +24 -3. Enquanto um arquivo é escrito, sua linha mais recente aparece logo abaixo, em tempo real. Clique em uma linha para ver as alterações.
• As linhas de comandos dizem em linguagem simples o que foi executado. Clique em uma para ver a saída.
• O plano. Para tarefas maiores, a IA apresenta um plano, e uma barra acima da caixa mostra a etapa atual, como Etapa 2 de 5. Clique na barra para ver o plano completo.
• A linha de status informa o que acontece entre as etapas, como Preparando seu projeto... ou Verificando se tudo funciona....

Quando a IA faz uma pergunta

Às vezes, a IA precisa de uma decisão, como o visual que você prefere ou qual serviço usar. Ela mostra a pergunta com opções para clicar.

• Clique em uma opção para responder.
• Clique em Outra coisa para digitar sua própria resposta.
• Clique em Sem preferência? Você decide para deixar a IA escolher.

Como aprovar ações

Algumas ações aguardam sua aprovação: publicar seu site (Publicar o site?), comandos que vão além de uma compilação normal, como excluir ou mover arquivos ou baixar algo, alterações no banco de dados que excluem dados ou tabelas e a exclusão de uma habilidade. Um cartão explica o que a IA quer fazer. Nada acontece até você clicar em Aceitar. Clique em Recusar para pular a ação.

Links, chaves e botões de conexão

As respostas podem incluir botões que levam você ao lugar certo no editor:

• Links para seções, como Configurações / Domínios ou Página / Configurações da página inicial, abrem essa parte do editor. Um link para o histórico de versões abre o histórico de versões.
• Cartões de conexão, como Conectar Resend, conectam esse serviço diretamente pelo chat. Se você já conectou uma conta dele em outro projeto, o cartão oferece essa conta. Veja Conectores no chat.
• Cartões em tempo real mostram os números de um serviço conectado, como a receita do Stripe ou os visitantes do Google Analytics, com links de Configurações e Abrir. Os números vêm diretamente do serviço.
• Nomes de chaves, como RESEND_API_KEY, são clicáveis. Clique em um para abrir Segredos nessa chave, pronta para você digitar o valor.
• Conectar uma fonte de dados aparece quando seu site precisa de um banco de dados. Abre a janela de conexão dentro do chat. Criar primeiro com dados de exemplo (ou Agora não) permite que a IA continue sem um banco de dados, e você pode conectar depois pelo painel de dados.

As respostas também podem mostrar amostras de cores, código com um botão Copiar e pré-visualizações ao vivo de um componente.

Imagens e arquivos

• Fotos de banco de imagens: a IA pode buscar fotos no Unsplash em qualquer plano.
• Imagens geradas: a IA pode criar imagens nos planos pagos. No plano gratuito, ela oferece uma foto de banco de imagens ou outra opção.
• Arquivos para você: a IA pode criar documentos, exportações de dados como CSV ou JSON e imagens para você guardar. Eles aparecem como um cartão com Abrir, que abre o arquivo em uma nova aba. Clique em ⋯ no cartão, ou clique nele com o botão direito, para Copiar link, Baixar, Renomear ou Excluir. Documentos são baixados como arquivos Markdown. Os arquivos ficam disponíveis por 90 dias após a última atualização, e você pode indicar um deles à IA novamente com @. Para baixar arquivos de código, é necessário um plano pago.

Arraste qualquer foto ou imagem gerada do chat para a área de edição para usá-la.

O que a IA pode fazer

• Criar e alterar páginas, componentes, estilos e conteúdo.
• Instalar pacotes e executar comandos no seu projeto.
• Verificar o próprio trabalho: fazer capturas de tela, ler logs de erros e procurar problemas.
• Pesquisar e ler conteúdo na web.
• Trabalhar com seu banco de dados conectado: criar tabelas e adicionar, atualizar, remover ou consultar dados.
• Ler seus conectores, como os erros no Sentry ou seus visitantes no Google Analytics, e pedir autorização antes de alterar algo neles.
• Ler seu site publicado: as análises, os erros em Logs, suas tarefas e as últimas execuções, além dos arquivos enviados pelas pessoas. Ela pode executar uma tarefa uma vez na pré-visualização e informa os horários no seu fuso horário.
• Trabalhar com sua conta Stripe: produtos, preços, links de pagamento e códigos de desconto.
• Fazer commits, push e pull, criar branches e abrir pull requests depois que você conectar o GitHub.
• Consultar versões anteriores salvas de um arquivo e restaurar uma delas.
• Ler seus outros chats no mesmo site quando você os menciona.
• Criar e atualizar suas habilidades.
• Publicar seu site, após sua aprovação.

Ela segue suas instruções para a IA em todas as mensagens.

O que a IA não pode fazer

• Alterar seu site no modo Chat. Uma ferramenta de um app conectado ou servidor MCP ainda pode ser executada nesse modo, após pedir sua autorização.
• Saber suas chaves secretas. Ela informa o nome de cada chave necessária, e você digita o valor.
• Conectar contas por você. Ela fornece o botão de conexão, e você conclui o processo.
• Gerar imagens no plano gratuito.
• Publicar, excluir dados ou executar comandos arriscados sem sua aprovação.

Créditos

Cada mensagem usa créditos do seu plano. O chat avisa quando eles estão acabando:

• Poucos créditos restantes aparece quando você já usou 90% dos seus créditos. Obter mais créditos abre as configurações da sua assinatura.
• Sem créditos por hoje ou Sem créditos grátis neste mês significa que os créditos gratuitos acabaram e a criação está pausada. Continuar criando mostra os planos para os quais você pode mudar, e Ver meu uso abre seu consumo.
• Os créditos deste mês acabaram aparece em um plano pago. Comprar créditos permite adicionar mais.
• Não pare por aqui aparece quando você está sem nenhum crédito. Continuar criando mostra os planos.

Se uma mensagem falhar, Tentar de novo a envia novamente. Se uma execução longa parar no meio, Continuar retoma de onde parou. As duas opções avisam que usam créditos. Veja Pagamentos e cobrança para saber sobre planos, créditos diários e recargas.

As execuções continuam

Se você fechar a aba ou recarregar a página enquanto a IA trabalha, a execução continua. Quando você volta, o chat retoma a execução ao vivo e mostra o que aconteceu durante sua ausência. Enquanto uma execução está em andamento, sua tela permanece ativa.

Os outros painéis ficam pausados enquanto a IA trabalha para evitar conflitos entre suas edições e as dela. Eles são liberados assim que ela termina.

Histórico de chats

O cabeçalho do painel mostra o nome do chat atual. Clique em + (Novo chat) para começar uma nova conversa ou no relógio (Histórico) para ver os chats anteriores.

Histórico de chats lista todos os chats deste site com suas datas. Clique em um para continuar a conversa. O botão de lixeira exclui um chat imediatamente, sem pedir confirmação.

Como desfazer alterações da IA

A IA edita os arquivos reais do seu projeto e salva o trabalho quando uma execução termina. Para desfazer uma alteração, pressione ⌘Z / Ctrl+Z ou abra o histórico de versões para voltar a uma versão anterior do site. Você também pode pedir à IA para deixar algo como estava antes.