A Practical Guide to Adding Nano Banana Image Tools to Claude Desktop, VS Code, and Cursor

If your coding assistant can already read files, run commands, and reason about a project, the next useful step is often visual: generating mockups, editing product shots, or iterating on image assets without leaving the IDE.

What you can do

Nano Banana MCP is an MCP server for connecting image generation and image editing tools to AI clients such as Claude Desktop, VS Code, and Cursor. Once it is configured, the assistant can call a small set of image-focused tools during a normal conversation instead of forcing you to switch to a separate image UI.

The documented tool surface is intentionally compact:

• nanobanana_generate_image — generate images from text prompts
• nanobanana_edit_image — edit or combine existing images
• nanobanana_get_task — query the status of one task
• nanobanana_get_tasks_batch — query multiple task statuses

The server supports the nano-banana, nano-banana-2, and nano-banana-pro models. That makes it a good fit for builder workflows where you want to move from a text idea to an image, then keep refining that image in the same chat.

Typical examples from the integration guide include prompts like:

• "Help me generate a watercolor landscape painting"
• "Photoshop this clothing onto this person"
• "Place this product in a café scene"
• "Generate a high-quality portrait using the nano-banana-pro model"

Those examples are useful because they show the real shape of the workflow: the user describes the image task in natural language, and the MCP client routes the request to the available Nano Banana tool.

How it works

MCP, or Model Context Protocol, gives AI clients a standard way to call external tools. In this setup, the local MCP server is mcp-nanobanana-pro. Your client starts that command, passes an Ace Data Cloud token through the ACEDATACLOUD_API_TOKEN environment variable, and then exposes the Nano Banana tools to the assistant.

The basic installation path is:

pip install mcp-nanobanana-pro

If you prefer installing from source, the documented path is:

git clone https://github.com/AceDataCloud/NanoBananaMCP.git
cd NanoBananaMCP
pip install -e .

After installation, the command your client needs to run is:

mcp-nanobanana-pro

The important thing is not to hard-code secrets in prompts or project files you plan to commit. Treat ACEDATACLOUD_API_TOKEN like any other API token: keep it local, rotate it if needed, and avoid pasting it into public issues or screenshots.

Configure Claude Desktop

For Claude Desktop, edit the client configuration file. The documented locations are:

• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
• Windows: %APPDATA%\\Claude\\claude_desktop_config.json

Add an MCP server named nanobanana:

{
  "mcpServers": {
    "nanobanana": {
      "command": "mcp-nanobanana-pro",
      "env": {
        "ACEDATACLOUD_API_TOKEN": "Your API Token"
      }
    }
  }
}

If you use uvx and do not want to install the package in advance, the guide also documents this version:

{
  "mcpServers": {
    "nanobanana": {
      "command": "uvx",
      "args": ["mcp-nanobanana-pro"],
      "env": {
        "ACEDATACLOUD_API_TOKEN": "Your API Token"
      }
    }
  }
}

Save the file, restart Claude Desktop, and start with a small request. For example, ask it to generate a simple icon concept or edit one existing image. A small first test makes it easier to verify that the server starts correctly and that the token is available to the process.

Configure VS Code or Cursor

For VS Code and Cursor, create .vscode/mcp.json in the project root:

{
  "servers": {
    "nanobanana": {
      "command": "mcp-nanobanana-pro",
      "env": {
        "ACEDATACLOUD_API_TOKEN": "Your API Token"
      }
    }
  }
}

The uvx version is similar:

{
  "servers": {
    "nanobanana": {
      "command": "uvx",
      "args": ["mcp-nanobanana-pro"],
      "env": {
        "ACEDATACLOUD_API_TOKEN": "Your API Token"
      }
    }
  }
}

This project-level setup is nice when the visual workflow belongs to a specific repository. For example, a frontend repo might use it for hero image drafts, empty-state illustrations, or product-placement experiments. A docs repo might use it to generate tutorial covers and diagrams. Because the MCP config lives with the workspace, the assistant has the right tool available where the work happens.

A practical workflow to try

Here is a simple builder-oriented loop:

1. Ask the assistant to draft a prompt for the image you need.
2. Run generation with nanobanana_generate_image.
3. Review the result in the chat or client output.
4. Ask for a targeted edit with nanobanana_edit_image.
5. Use nanobanana_get_task if the client needs to check task progress.

For example, in a product UI project you might say:

Generate a clean dashboard illustration for a dark-mode SaaS landing page. Use a minimal terminal panel, API cards, and a blue/green accent palette.

Then follow up with:

Edit the image so the API cards are less crowded and the terminal panel is more prominent.

That is where MCP feels useful: the same assistant that understands your implementation context can also help you iterate on visual assets.

Closing notes

Nano Banana MCP is not a replacement for design judgment, but it is a practical way to bring image generation and editing closer to where builders already work: Claude Desktop, VS Code, and Cursor. Start with a narrow use case, keep prompts specific, and treat the generated output as a draft you can refine.

The full setup reference is in the Ace Data Cloud Nano Banana MCP documentation: https://platform.acedata.cloud/documents/nano-banana-mcp