Gemini Nanobanana MCP

Gemini Nanobanana MCP

Enables AI image generation, editing, composition, and style transfer in Claude conversations using Google's Gemini 2.5 Flash model. Automatically saves generated images to a local directory.

Category
访问服务器

README

🎨 Gemini Nanobanana MCP

npm version License: MIT TypeScript Node.js

Generate images from text with Claude! Simply type "Draw a cute cat" and get instant AI-generated images.

A beginner-friendly Model Context Protocol (MCP) server that brings Google's Gemini 2.5 Flash Image generation directly into your Claude conversations.

Quick Start - Just 3 Steps

1️⃣ Get Your API Key (1 minute)

  1. Visit Google AI Studio
  2. Sign in with your Google account
  3. Click "Create API key" → Copy the key

2️⃣ Install in Your Claude Client (2 minutes)

<details> <summary><b>Claude Desktop (Windows)</b></summary>

  1. Open Notepad
  2. Copy this code and replace YOUR_API_KEY with your actual key:
{
  "mcpServers": {
    "gemini-nanobanana-mcp": {
      "command": "npx",
      "args": ["gemini-nanobanana-mcp@latest"],
      "env": {
        "GEMINI_API_KEY": "YOUR_API_KEY"
      }
    }
  }
}
  1. Save as: %APPDATA%/Claude/claude_desktop_config.json
  2. Restart Claude Desktop

</details>

<details> <summary><b>Claude Desktop (Mac)</b></summary>

  1. Open Terminal (search "Terminal" in Spotlight)
  2. Run this command (replace YOUR_API_KEY):
cat > ~/Library/Application\ Support/Claude/claude_desktop_config.json << 'EOF'
{
  "mcpServers": {
    "gemini-nanobanana-mcp": {
      "command": "npx",
      "args": ["gemini-nanobanana-mcp@latest"],
      "env": {
        "GEMINI_API_KEY": "YOUR_API_KEY"
      }
    }
  }
}
EOF
  1. Restart Claude Desktop

</details>

<details> <summary><b>Claude Code (Easiest!)</b></summary>

Just run this one command in your terminal (replace YOUR_API_KEY):

claude mcp add gemini-nanobanana-mcp -s user -e GEMINI_API_KEY="YOUR_API_KEY" -- npx -y gemini-nanobanana-mcp@latest

</details>

<details> <summary><b>Cursor</b></summary>

  1. Go to Cursor SettingsMCPAdd new MCP Server
  2. Fill in:
    • Name: gemini-nanobanana-mcp
    • Command: npx
    • Args: gemini-nanobanana-mcp@latest
    • Environment Variables: GEMINI_API_KEY = YOUR_API_KEY
  3. Restart Cursor

</details>

3️⃣ Start Creating! (0 minutes)

Try these in Claude:

  • "Generate a cute puppy playing in a garden"
  • "Create a beautiful sunset over mountains"
  • "Draw a red sports car"
  • "Make an abstract colorful painting"

Your images automatically save to ~/Downloads/gemini-images/


See It In Action

Basic Usage

You: Generate a cozy coffee shop interior
Claude: [Generating image...]
Image generated and saved to: ~/Downloads/gemini-images/generate-2025-01-09-14-30-45.png
Size: 1.2MB | Format: PNG

Custom Save Location

You: Create a sunset landscape and save it as ./my-sunset.png
Claude: Image saved to: ./my-sunset.png

What You Can Do

Text-to-Image Generation

Create any image you can imagine from a text description.

Examples:

  • "A majestic dragon flying over a medieval castle"
  • "Modern minimalist living room with plants"
  • "Vintage bicycle on a cobblestone street"

Image Editing

Edit existing images with natural language instructions.

How to use:

  • Upload an image to Claude
  • Say: "Make this image black and white"
  • Or: "Add a sunset background to this photo"

Image Composition

Combine multiple images into one creative composition.

How to use:

  • Upload 2-10 images to Claude
  • Say: "Combine these images into a collage"
  • Or: "Blend these photos together artistically"

Style Transfer

Apply the artistic style of one image to another.

How to use:

  • Upload two images: a content image and a style reference
  • Say: "Apply the style of the second image to the first"

Configuration Options

<details> <summary><b>Environment Variables</b></summary>

Variable Default Description
GEMINI_API_KEY Required Your Google AI Studio API key
AUTO_SAVE true Automatically save images when no path specified
DEFAULT_SAVE_DIR ~/Downloads/gemini-images Default directory for saved images
LOG_LEVEL info Logging level (error, warn, info, debug)

Example with custom settings:

{
  "mcpServers": {
    "gemini-nanobanana-mcp": {
      "command": "npx",
      "args": ["gemini-nanobanana-mcp@latest"],
      "env": {
        "GEMINI_API_KEY": "your-api-key",
        "AUTO_SAVE": "true",
        "DEFAULT_SAVE_DIR": "~/Pictures/AI-Images",
        "LOG_LEVEL": "debug"
      }
    }
  }
}

</details>

<details> <summary><b>Disable Auto-Save</b></summary>

To only save when you explicitly request it:

{
  "env": {
    "GEMINI_API_KEY": "your-api-key",
    "AUTO_SAVE": "false"
  }
}

Then images will only appear in the chat without saving to disk.

</details>


Instant Image Preview (Claude Code)

Want images to open automatically after generation? Set up Claude Code hooks for instant Quick Look previews!

One-Click Setup (Mac)

# Clone this repo and run the installer
git clone https://github.com/nanobanana/nanobanana-mcp.git
cd nanobanana-mcp
bash hooks/install.sh

What You Get

  • Instant Preview: Generated images open automatically in Quick Look
  • Zero Manual Work: No more finding and opening files
  • Smart Detection: Only triggers for nanobanana image tools
  • Press Space to Close: Standard Quick Look controls

Full setup guide: hooks/README.md


Troubleshooting

<details> <summary><b>❌ "GEMINI_API_KEY not set" error</b></summary>

Solution:

  1. Double-check you replaced YOUR_API_KEY with your actual API key
  2. Make sure there are no extra spaces around the key
  3. Restart your Claude client completely
  4. Verify your API key works at Google AI Studio

</details>

<details> <summary><b>"No such file or directory" error</b></summary>

Solution:

  1. Install Node.js from nodejs.org (choose LTS version)
  2. Restart your terminal/Claude client
  3. Try the installation again

</details>

<details> <summary><b>Images not generating</b></summary>

Checklist:

  • API key correctly set?
  • Internet connection working?
  • Restart Claude after configuration?
  • Try a simple prompt: "Generate a blue circle"

</details>

<details> <summary><b>Images not saving automatically</b></summary>

Solution: Check your configuration has AUTO_SAVE: "true" (default behavior). If you want to disable auto-save, set it to "false".

</details>

<details> <summary><b>Hook setup not working</b></summary>

Common fixes:

  1. Make sure you're using Claude Code (not Claude Desktop)
  2. Run the installer from the nanobanana-mcp directory
  3. Restart Claude Code after installation
  4. Check hooks/README.md for detailed troubleshooting

</details>


Tips for Better Images

Prompt Writing Tips

  • Be specific: "A golden retriever puppy" vs "A dog"
  • Include style: "in watercolor style", "photorealistic", "cartoon style"
  • Add details: "with blue eyes", "in a sunny garden", "wearing a red collar"
  • Set the mood: "cozy", "dramatic", "peaceful", "energetic"

Technical Details

  • Supported formats: PNG, JPEG, WebP, GIF
  • Default output: PNG format
  • Image size: Optimized for quality and reasonable file size
  • Rate limits: Managed automatically with retry logic

🚀 Advanced Features

<details> <summary><b>🔗 HTTP Mode (for integrations)</b></summary>

Run as an HTTP server instead of stdio:

MCP_TRANSPORT=http MCP_HTTP_PORT=8080 npx gemini-nanobanana-mcp@latest

Access at http://localhost:8080/mcp

</details>

<details> <summary><b>📊 Debug Logging</b></summary>

Enable detailed logging:

{
  "env": {
    "GEMINI_API_KEY": "your-key",
    "LOG_LEVEL": "debug"
  }
}

</details>


💡 Need Help?


🤝 Contributing

Found a bug? Have a feature idea? Contributions are welcome!

  1. Fork the repository
  2. Create your feature branch
  3. Make your changes
  4. Submit a pull request

📄 License

MIT License - feel free to use this in your own projects!


⭐ If this helped you, please star the repository on GitHub!

Built with ❤️ for the Claude community

推荐服务器

Baidu Map

Baidu Map

百度地图核心API现已全面兼容MCP协议,是国内首家兼容MCP协议的地图服务商。

官方
精选
JavaScript
Playwright MCP Server

Playwright MCP Server

一个模型上下文协议服务器,它使大型语言模型能够通过结构化的可访问性快照与网页进行交互,而无需视觉模型或屏幕截图。

官方
精选
TypeScript
Magic Component Platform (MCP)

Magic Component Platform (MCP)

一个由人工智能驱动的工具,可以从自然语言描述生成现代化的用户界面组件,并与流行的集成开发环境(IDE)集成,从而简化用户界面开发流程。

官方
精选
本地
TypeScript
Audiense Insights MCP Server

Audiense Insights MCP Server

通过模型上下文协议启用与 Audiense Insights 账户的交互,从而促进营销洞察和受众数据的提取和分析,包括人口统计信息、行为和影响者互动。

官方
精选
本地
TypeScript
VeyraX

VeyraX

一个单一的 MCP 工具,连接你所有喜爱的工具:Gmail、日历以及其他 40 多个工具。

官方
精选
本地
graphlit-mcp-server

graphlit-mcp-server

模型上下文协议 (MCP) 服务器实现了 MCP 客户端与 Graphlit 服务之间的集成。 除了网络爬取之外,还可以将任何内容(从 Slack 到 Gmail 再到播客订阅源)导入到 Graphlit 项目中,然后从 MCP 客户端检索相关内容。

官方
精选
TypeScript
Kagi MCP Server

Kagi MCP Server

一个 MCP 服务器,集成了 Kagi 搜索功能和 Claude AI,使 Claude 能够在回答需要最新信息的问题时执行实时网络搜索。

官方
精选
Python
e2b-mcp-server

e2b-mcp-server

使用 MCP 通过 e2b 运行代码。

官方
精选
Neon MCP Server

Neon MCP Server

用于与 Neon 管理 API 和数据库交互的 MCP 服务器

官方
精选
Exa MCP Server

Exa MCP Server

模型上下文协议(MCP)服务器允许像 Claude 这样的 AI 助手使用 Exa AI 搜索 API 进行网络搜索。这种设置允许 AI 模型以安全和受控的方式获取实时的网络信息。

官方
精选