How to Use NanoBanana MCP from Claude Code for Practical Image Editing

How to Use NanoBanana MCP from Claude Code for Practical Image Editing

If your coding workflow already lives in the terminal, switching to a browser just to create or edit one image can feel like unnecessary context switching. NanoBanana MCP gives Claude Code a way to call image-generation and image-editing tools from the same terminal session where you are writing docs, fixing UI copy, or preparing a release.

What you can do

The NanoBanana MCP guide focuses on a simple idea: connect Claude Code to a remote MCP server, then ask for image work in natural language. Once connected, Claude Code can use two documented tools:

  • nanobanana_generate_image for text-to-image generation.
  • nanobanana_edit_image for image editing, including multiple image inputs.

The practical use cases are the kind that appear during normal product development: creating an illustration for a 404 page, removing unwanted text from a screenshot, or composing one image into another while matching angle and lighting. The important part is that you describe the desired edit, and Claude Code can route that request through the MCP tool instead of making you leave the terminal.

How it works

MCP, or Model Context Protocol, lets an AI coding assistant call external tools during a session. In this setup, Claude Code talks to the NanoBanana MCP endpoint at https://nanobanana.mcp.acedata.cloud/mcp. Authentication is sent with an HTTP header, using an Ace Data Cloud API token:

-H "Authorization: Bearer YOUR_ACEDATACLOUD_API_KEY"

The documentation calls out one small but easy-to-miss detail: -H must be uppercase. In Claude Code's CLI, lowercase -h is interpreted as help, so a configuration command can fail for a reason that looks unrelated to authentication.

Step 1: Add NanoBanana MCP to the current project

For a first test, use the local scope. This binds the MCP configuration to the project directory where you run the command. Claude Code records the configuration in the local ~/.claude.json file together with the current project path.

claude mcp add nanobanana --transport http https://nanobanana.mcp.acedata.cloud/mcp \
  -H "Authorization: Bearer YOUR_ACEDATACLOUD_API_KEY" \
  -s local

This is the safest way to learn the workflow because it does not automatically expose the tool to every project you open later.

Step 2: Choose the right scope for daily work

Once you know the tool fits your workflow, the guide documents two other scopes.

Use user if you want NanoBanana MCP available across multiple projects:

claude mcp add nanobanana --transport http https://nanobanana.mcp.acedata.cloud/mcp \
  -H "Authorization: Bearer YOUR_ACEDATACLOUD_API_KEY" \
  -s user

Use project when a team wants to share the MCP configuration through the current repository. This writes a .mcp.json file in the project root:

claude mcp add nanobanana --transport http https://nanobanana.mcp.acedata.cloud/mcp \
  -H "Authorization: Bearer YOUR_ACEDATACLOUD_API_KEY" \
  -s project

The project scope is useful for private team repositories, but it also requires discipline: do not commit a real token into a public repository. The documented examples use YOUR_ACEDATACLOUD_API_KEY as a placeholder for exactly that reason. If Claude Code reads a project-level configuration for the first time, it may show Pending approval; confirm trust for the project configuration inside the Claude Code session.

Step 3: Verify the connection before asking for edits

After adding the server, run:

claude mcp list

A successful connection shows nanobanana as ✓ Connected. If it does not, the guide recommends checking the token, service URL, and configuration scope. Avoid debugging from old screenshots or fixed tool counts; the reliable check is the live handshake result from claude mcp list.

Step 4: Use natural-language editing prompts

Once connected, you can describe image work directly in Claude Code. For multi-image composition, the guide gives a useful pattern: pass multiple image URLs and tell the model how the images relate to one another.

Place the phone from the first image onto the desk in the second image, adjusting the angle and lighting to make it look natural.

For cleanup tasks, keep the instruction concrete and localized:

Edit this image to remove the text watermark in the lower right corner, filling it with the background.

For documentation or web UI work, you can also ask for a new illustration:

Generate an illustration of a small dinosaur squatting next to a crack in the ground looking down, to be used for a 404 page.

These examples work well because they describe the asset, the operation, and the intended use. That gives Claude Code enough context to decide whether to use nanobanana_generate_image or nanobanana_edit_image.

A builder-friendly workflow

The best way to use NanoBanana MCP is not as a separate design app, but as a small tool arm inside your existing development loop. Write the docs, notice that a screenshot needs cleanup, ask Claude Code to edit it, then continue with the pull request or release notes. Start with -s local, verify with claude mcp list, and only move to user or project scope after the workflow proves useful.

For the full configuration reference, read the Ace Data Cloud document: Claude Code with Nano Banana MCP.

Comments

Post a Comment

Popular posts from this blog

Artistic QR Code API Integration Guidance

Image
Artistic QR code is an innovative technological product that combines QR codes with beautiful background images, creating practical and visually appealing works. They not only possess the functionality of traditional QR codes, allowing quick scanning and recognition by smart devices, but also incorporate artistic elements to enhance visual appeal and brand recognition. Some artistic QR codes are even generated by artificial intelligence, fully leveraging modern technology to demonstrate unparalleled innovation and uniqueness. This makes artistic QR codes widely applicable in areas such as brand marketing and advertising. In simple terms, artistic QR codes are the perfect combination of QR code scanning and artistic aesthetics. They not only provide the function of information transmission, but also enhance the user's visual experience, making each scan a delightful artistic enjoyment. Overview of Artworks Let's take a look at a few QR code works: How are they? These are ar...
Read more

How to Configure Claude Code with CC Switch and Ace Data Cloud

Image
If you use Claude Code across a terminal, VS Code, or remote development setup, the awkward part is often not the model itself but the configuration: where should requests go, where should the token live, and how do you switch providers without editing files by hand? This guide walks through a practical setup using CC Switch as the graphical configuration manager and Ace Data Cloud as the Anthropic-compatible base URL. The goal is simple: configure Claude Code once, verify the active endpoint, and keep the setup easy to change later. What you can do With the setup described in the Ace Data Cloud documentation, you can: Manage Claude Code provider configuration through a desktop UI instead of manually editing settings.json . Store an Ace Data Cloud provider with ANTHROPIC_BASE_URL and ANTHROPIC_AUTH_TOKEN . Switch the active Claude Code provider from CC Switch without rewriting your configuration every time. Use the same provider configuration from the terminal an...
Read more

How to Build a Server-Side Image Editing Workflow with GPT-Image-2

Image
If your product needs image editing, the hard part is rarely the model call itself. The real challenge is building a reliable workflow around user images, reference assets, predictable output sizes, and slow-running jobs without forcing every file through a manual upload step. This guide walks through a practical server-side workflow using the OpenAI Images Edits API on Ace Data Cloud. The focus is gpt-image-2 , because the documented editing flow supports direct image URLs, base64 input, multiple reference images, high-resolution output through size , and asynchronous callbacks. What you can do The edits endpoint is designed for turning one or more input images plus an instruction into a modified output image. In practical terms, you can use it to: Convert an existing infographic or poster into a different visual theme while preserving its layout. Change a product, shelf, room, or object style while keeping the original arrangement stable. Pass image URLs directly f...
Read more