Voltar ao blog
BananaBanana Teamtutorialmcpcursor

Gerar imagens no Cursor: Guia de Configuração MCP

Conecte o Cursor a um servidor MCP remoto e gere imagens direto no seu repositório: mcp.json, variáveis de ambiente, quirks e custos reais a partir de $0.03.

Gerar imagens no Cursor: Guia de Configuração MCP

Um servidor MCP para o Cursor é como uma caixa de ferramentas externa que o agente do editor pode acionar diretamente pelo chat: basta adicionar um bloco JSON ao arquivo mcp.json, e o Cursor ganha habilidades que seus modelos base não possuem, incluindo a geração de imagens. O agente do Cursor edita arquivos e executa comandos no terminal o dia todo, mas nenhum dos modelos por trás dele consegue gerar um arquivo de imagem de fato. Ao conectar um servidor de geração, uma instrução simples como "crie um banner hero de 16:9 para esta landing page" vira um comando comum no chat que resulta em um arquivo real no seu repositório.

Se você veio só por isso, aqui está a configuração completa. Crie uma chave de API no seu perfil do BananaBanana e adicione o seguinte bloco ao arquivo ~/.cursor/mcp.json (global) ou .cursor/mcp.json no seu projeto:

{
  "mcpServers": {
    "bananabanana": {
      "url": "https://bananabanana.pro/api/mcp",
      "headers": {
        "Authorization": "Bearer ${env:BB_API_KEY}"
      }
    }
  }
}

Exporte BB_API_KEY=bb_live_YOUR_KEY no seu ambiente e pronto. Sem processo de servidor local, sem conta no Google Cloud, sem assinatura. As imagens são cobradas a partir de $0.03 usando um saldo pré-pago, e os vídeos a partir de $0.10. Ambas as imagens de demonstração deste guia foram geradas com essa exata configuração usando uma chave activa enquanto eu escrevia este texto; os logs de execução e a fatura de mídia de $0.55 estão logo abaixo.

Por que acoplar um gerador de imagens ao Cursor?

Because quem trabalha com frontend precisa de imagens exatamente na hora em que está com a mão no código. Um banner hero para a landing page. Placeholders de produtos para que o grid de cards não vá para produção com caixas cinzas vazias. Uma imagem OG para o post do blog que você acabou de estruturar. Nenhuma dessas tarefas é difícil, mas cada uma delas costumava exigir o mesmo desvio: abrir um gerador em uma aba do navegador, digitar o prompt, baixar o arquivo, renomear, arrastar para a pasta public/, voltar e escrever a tag <img>. São dez minutos de trabalho repetitivo por recurso visual, o suficiente para você perder o foco no desenvolvimento do componente.

Com um servidor MCP, o agente cuida de todo esse fluxo. Ele escreve o prompt (geralmente melhor do que meu rascunho inicial feito às pressas), chama a ferramenta generate_image, baixa o resultado para a pasta correta e escreve a marcação com o respectivo texto alternativo (alt). Você só precisa revisar o diff em vez de perder tempo com tarefas mecânicas.

A outra metade da vantagem está no que você deixa de instalar. Existem servidores MCP locais para geração de imagens que funcionam bem, mas exigem que você execute seu próprio processo Node ou Python e configure sua própria chave de API do Google, lidando com cotas e faturamento na sua conta do Google. Um servidor remoto elimina tudo isso: o endpoint já roda do nosso lado, no mesmo pipeline do gerador do BananaBanana, e sua única credencial é uma única chave bb_live_.

Ilustração editorial de um notebook conectado por um cabo brilhante a um pequeno estúdio de arte em uma nuvem, uma metáfora para o Cursor chamando um servidor MCP remoto de geração de imagens

Como adicionar um servidor MCP ao Cursor?

São três etapas que levam cerca de dois minutos. Os detalhes de configuração abaixo foram validados de acordo com a documentação oficial do Cursor MCP em 11 de julho de 2026.

Primeiro, faça seu registro e acesse Perfil → Chaves de API MCP. Crie uma chave. Ela será exibida apenas uma vez, começa com bb_live_, e fica armazenada de forma criptografada (hash) do nosso lado, por isso copie-a imediatamente. Contas novas começam com um saldo de $0.20, o suficiente para gerar seis imagens de teste no modelo mais barato.

Segundo, escolha onde a configuração ficará salva. O Cursor lê dois locais possíveis:

  • ~/.cursor/mcp.json — global, o servidor fica disponível em todos os seus projetos;
  • .cursor/mcp.json na raiz do repositório — escopo de projeto, sendo seguro comitá-lo se você mantiver a chave fora dele.

Esse "se" é resolvido justamente pela interpolação de ${env:BB_API_KEY} no trecho de código mostrado acima: o Cursor substitui as variáveis de ambiente nos valores do mcp.json no momento em que é carregado, garantindo que o arquivo em si não contenha nenhuma informação confidencial. Essa mesma sintaxe também suporta ${workspaceFolder} e algumas outras variáveis, de acordo com a documentação.

Terceiro, reinicie ou recarregue o Cursor e abra Cursor Settings → MCP. O servidor deve aparecer com um indicador verde e uma lista de sete ferramentas, de list_models a list_generations. Nossa página do servidor MCP traz esse mesmo trecho de código e uma tabela de compatibilidade para todos os outros clientes que validamos:

Trecho da configuração do Cursor na página de documentação do MCP do BananaBanana mostrando o bloco mcp.json com interpolação de variáveis de ambiente

Se o servidor não aparecer, pule direto para a seção de quirks e particularidades. Quase sempre a causa está na variável de ambiente, e não na configuração em si.

Caso de uso: banner hero e fotos de produtos sem sair do chat

O cenário usado para este artigo: você é um desenvolvedor frontend montando uma landing page para uma marca de equipamentos de acampamento e atividades ao ar livre, e o design exige um banner hero em tela cheia que mostre um acampamento ao amanhecer. No chat do Cursor, você simplesmente pede a imagem; o agente cria um prompt com técnicas de fotografia e chama a ferramenta. Este é o log real da minha sessão, com o job id original e tudo mais:

→ generate_image {"prompt": "A photorealistic wide hero shot for an outdoor
   gear brand landing page: a lone orange tent glowing softly on the shore of
   a still alpine lake at dawn, mist over the water, sharp granite peaks
   catching the first pink light, generous empty sky for headline text, low
   angle, 35mm lens, no text", "model": "nano-banana-pro", "aspect_ratio": "16:9"}
← {"job_id": "cmrgox3xj000s…", "status": "processing",
   "cost_charged_usd": 0.11, "balance_remaining_usd": 1554.40}
→ get_result {"job_id": "cmrgox3xj000s…"}
← {"status": "completed", "files": [{"url": "https://bananabanana.pro/api/files/…"}]}

Dezoito segundos entre a chamada e o arquivo finalizado. Aqui está exatamente o resultado gerado, de primeira, sem novas tentativas:

Banner hero de landing page gerado por IA mostrando uma barraca laranja ao lado de um lago alpino com névoa ao amanhecer, criado no Cursor através do servidor MCP do BananaBanana

Depois, o agente baixa o arquivo da URL assinada para a pasta public/ e monta o componente. Os links permanecem válidos por 24 horas; após esse período, uma nova chamada a get_result gera links atualizados.

Placeholder de produto fotorrealista de uma garrafa de água de aço escovado com tampa verde-salvia sobre granito, gerado no Cursor via MCP para um grid de cards de landing page

Ambos os exemplos rodaram no Nano Banana Pro porque estão publicados diretamente nesta página. Para placeholders temporários de grid, sinceramente, eu usaria o nano-banana-2-lite a $0.03 e faria o upgrade apenas para as imagens aprovadas na revisão de design; nosso guia Lite explica onde o modelo de baixo custo é suficiente. Se você precisar do mesmo personagem em uma série de imagens, a técnica de prompt importa mais do que o cliente usado, então confira o guia prático de consistência de personagens.

A geração de vídeos também funciona a partir do mesmo chat. A ferramenta generate_video nunca cobra na primeira chamada: ela retorna um orçamento estimativo e o agente precisa repetir a chamada passando o confirm_cost com o valor exato. Um clipe silencioso de 720p no Veo 3.1 Lite começa em $0.10; o Omni Flash com áudio custa $0.10 por segundo, então $0.30 para uma tomada de três segundos.

Particularidades do Cursor que vale a pena conhecer antes de publicar

Todo cliente de MCP tem seus pontos de atenção. Aqui estão os detalhes que eu realmente recomendaria a um colega de equipe, reunidos durante os testes desta configuração.

Ilustração editorial de um pequeno robô examinando três placas com uma casa, uma pasta e um cadeado, uma metáfora para os escopos de configuração e segredos do Cursor

1. A interpolação de ${env:…} só funciona se o Cursor conseguir visualizar a variável. Um export no seu .zshrc fica visível quando você inicia o Cursor pelo terminal, mas um aplicativo de interface gráfica aberto pelo Dock ou por um atalho na área de trabalho não lê o perfil do seu shell. Com isso, a mesma configuração falha silenciosamente. Pela minha experiência, esse é o motivo número um para problemas de conexão de servidores MCP no macOS. Como corrigir: configure a variável no nível do sistema operacional (launchctl setenv no macOS ou variáveis de ambiente do sistema no Windows) ou inicie o Cursor pelo terminal para confirmar que o resto da configuração está correto.

2. A configuração por projeto é excelente para equipes, sendo uma chave por pessoa. Ao comitar o arquivo .cursor/mcp.json com o placeholder ${env:BB_API_KEY}, qualquer colega de equipe tem acesso imediato ao servidor assim que clona o projeto, cada um usando a sua própria chave de API. Essa divisão é mais importante do que parece: as chaves são gratuitas e cada uma mantém seu próprio log de uso (ferramenta, modelo, custo, pré-visualização do prompt) e um limite diário opcional em dólares (USD) configurável em Perfil → Chaves de API MCP. Se alguém sair da equipe, basta revogar aquela chave específica e o restante do time continua trabalhando normalmente. Os planos corporativos do Cursor também permitem gerenciar servidores MCP pelo painel da equipe, mas o arquivo comitado funciona perfeitamente em qualquer plano.

3. O Cursor solicita permissão antes de chamar qualquer ferramenta, e você provavelmente deve manter isso ativado. Por padrão, cada chamada de MCP aguarda a sua aprovação, mostrando os argumentos enviados sob uma pequena seta ao lado do nome da ferramenta. No modo de execução automática, as ferramentas permitidas (allowlisted) rodam imediatamente. Eu sei que clicar em aprovar vinte vezes seguidas durante um lote de imagens cansa, mas para ferramentas que suprem dinheiro real por chamada, sugiro deixar a aprovação manual ligada e permitir a execução automática apenas para as ferramentas gratuitas (list_models, get_result). Para vídeos, há um mecanismo de proteção extra do nosso lado: nenhuma cobrança acima do orçamento estimado é efetuada sem o parâmetro confirm_cost.

4. Você visualiza a imagem gerada diretamente no chat. Conforme a documentação do Cursor, as imagens retornadas pelas ferramentas MCP são anexadas à conversa, permitindo que os modelos com suporte a visão computacional as analisem. Nossa ferramenta get_result envia uma miniatura em formato webp junto com a URL, de modo que o agente (e você) possam avaliar o resultado sem precisar abrir o navegador. Isso também permite que o próprio agente se corrija: peça para ele analisar a imagem e rodar o prompt novamente se, por exemplo, a barraca tiver ficado bem em cima da área reservada para o título principal.

5. Existem links de instalação em um clique, mas evite colocar chaves de API neles. O Cursor suporta links diretos do tipo cursor:// deeplinks que instalam um servidor MCP a partir de uma configuração codificada em base64, conforme a documentação sobre links de instalação. Isso é muito prático para servidores abertos ao público, mas perigoso para servidores autenticados, pois a configuração codificada conteria sua chave literal e qualquer pessoa com acesso ao link poderia consumir seu saldo. É por isso que o botão no nosso site disponibiliza um trecho de código para copiar e colar com um espaço reservado para variável de ambiente, em vez de um link direto do tipo "Add-to-Cursor". Basta colar, exportar a variável e pronto.

Para sermos bem transparentes quanto às limitações atuais do produto: a ferramenta generate_image via MCP ainda não aceita imagens de entrada, ou seja, geração baseada em referências e imagem para vídeo ainda exigem o uso do gerador do BananaBanana. No entanto, texto para imagem, refinamentos iterativos com edit_image e texto para vídeo já funcionam via MCP atualmente.

Quanto custou a produção das mídias deste artigo?

Preços padrão por geração, exatamente os mesmos valores que list_models reporta ao agente, sem qualquer desconto interno:

Recurso visualModeloPreço
Demo do banner hero, via MCP com chave ativaNano Banana Pro, 1K$0.11
Demo de placeholder de produto, via MCPNano Banana Pro, 1K$0.11
Capa + 2 ilustrações editoriaisNano Banana Pro, 1K$0.33
Captura de tela da página de documentaçãonavegador, não gerado por IA$0.00
Total$0.55

Desta vez, todas as mídias foram geradas com sucesso logo na primeira tentativa, o que nem sempre acontece. Sugiro planejar uma ou duas tentativas adicionais para fotos de produtos e fazer um zoom de aproximação antes de publicá-las, já que a geometria de objetos ainda é o ponto onde modelos fotorrealistas costumam falhar com mais frequência.

Se você já utiliza este servidor no Claude, a configuração do Cursor explicada acima é a única novidade: a chave de API, o saldo e o histórico de uso continuam os mesmos. Se você está começando do zero, o passo a passo do Claude Code detalha outros quatro casos de uso aplicáveis quase textualmente ao Cursor. Pronto para testar? Crie uma chave e peça sua primeira imagem hero diretamente ao Cursor.

FAQ

O Cursor suporta servidores MCP remotos com cabeçalho de autorização (Authorization header)?

Sim, nativamente. Desde que o Cursor adicionou suporte ao transporte Streamable HTTP, conectar um servidor remoto exige apenas uma url e um objeto opcional de headers no seu arquivo mcp.json, sem necessidade de processos locais de ponte (bridge). Além disso, a interpolação de ${env:VAR} protege suas chaves fora do arquivo. Essa é exatamente a configuração adotada neste guia, validada de acordo com a documentação oficial do Cursor MCP em 11 de julho de 2026. O Cursor também oferece suporte a OAuth para servidores remotos; atualmente nosso endpoint autentica usando chaves Bearer, com previsão de disponibilizarmos o OAuth 2.1 como uma segunda opção de integração.

Preciso de uma chave de API do Google para gerar imagens no Cursor?

Não. Os servidores MCP de imagem locais chamam diretamente a API do Gemini, o que exige que você use sua própria chave do Google e gerencie cotas e pagamentos diretamente na sua conta. Com o servidor remoto, o processamento ocorre no pool gerenciado de chaves da Vertex AI do BananaBanana, e sua única credencial necessária é a chave bb_live_ obtida no seu perfil. Dessa forma, você substitui a necessidade de manter uma infraestrutura de API direta do Google por preços sob demanda por geração, sem consumo mínimo exigido, em um saldo pré-pago único e com uma chave que pode ser revogada com um clique.

A configuração do MCP deve ser global ou por projeto?

As duas abordagens funcionam; a diferença está no escopo de uso e no compartilhamento. O arquivo ~/.cursor/mcp.json acompanha você em qualquer repositório local, sendo ideal para configurações de uso pessoal. Já o .cursor/mcp.json na raiz do projeto é salvo junto com o repositório, garantindo que toda a equipe tenha acesso ao servidor MCP imediatamente após clonar o projeto; ao utilizar o segredo via referência de ${env:…}, o arquivo pode ser comitado sem riscos. Minha recomendação padrão é usar o escopo de projeto para códigos em que haja colaboração, pois a configuração comitada aliada a chaves individuais por desenvolvedor fornece logs de uso detalhados e possibilidade de revogação de acessos por pessoa.

O Cursor consegue gerar vídeos através do mesmo servidor?

Sim, passando por uma etapa de confirmação de custo. A ferramenta generate_video sempre exibe um orçamento estimativo primeiro, sendo necessário que o agente envie uma segunda chamada contendo o confirm_cost com o valor correspondente exato antes que qualquer cobrança ocorra. Os preços começam em $0.10 para clipes de 4 segundos silenciosos em 720p no Veo 3.1 Lite e chegam até $4.40 para renderizações de alta qualidade com áudio no Veo 3.1. Já a geração no Omni Flash com áudio custa $0.10 por segundo ($0.30–$1.00 por clipe). Como a renderização dos clipes pode levar de um a dez minutos, o agente consulta get_result em segundo plano enquanto você continua trabalhando nas suas linhas de código.

Por que meu servidor não aparece no Cursor depois que edito o mcp.json?

Existem três causas prováveis para isso, em ordem de probabilidade. Primeiro, a variável de ambiente não está visível para o processo do Cursor: aplicativos iniciados pela interface gráfica não leem o seu perfil do shell. Para resolver, defina a variável no nível do sistema operacional (launchctl setenv no macOS ou variáveis de ambiente do sistema no Windows) ou execute o Cursor a partir de um terminal. Segundo, a configuração não foi recarregada: reinicie o Cursor completamente ou clique no botão de recarregamento nas configurações do MCP. Terceiro, o JSON pode estar com algum erro sutil de sintaxe, sendo uma vírgula sobrando o caso mais clássico. Se o servidor for listado mas as chamadas falharem com erro 401, a chave em si pode estar incorreta ou ter sido revogada; faça um teste rápido enviando uma requisição direta conforme o exemplo disponível na página do servidor MCP.

tutorialmcpcursor