Nano Banana MCP

🚀 Nano-Banana MCP Server 🍌

このプロジェクトは、完全に機能する本番環境向けアプリケーションをゼロから作成できるAIコーディングアシスタントであるClaude Codeによって生成されました。

このサーバーは、GoogleのGemini 2.5 Flash Image APIを使用して、AIによる画像生成と編集機能を提供するModel Context Protocol (MCP) サーバーです。シンプルなテキストプロンプトで、見事な画像を生成し、既存の画像を編集し、あなたの作品を繰り返し改善することができます。

✨ 主な機能

• 🎨 画像生成：テキスト記述から新しい画像を作成します。
• ✏️ 画像編集：テキストプロンプトで既存の画像を修正します。
• 🔄 反復編集：最後に生成/編集した画像を続けて編集できます。
• 🖼️ 複数の参照画像：スタイル転送やガイダンスのために参照画像を使用します。
• 🌍 クロスプラットフォーム：Windows、macOS、Linux用のスマートなファイルパスをサポートします。
• 🔧 簡単なセットアップ：APIキーで簡単に設定できます。
• 📁 自動ファイル管理：整理された命名規則で画像を自動保存します。

🔑 セットアップ

1. Gemini APIキーを取得する：
   • Google AI Studioにアクセスします。
   • 新しいAPIキーを作成します。
   • 設定用にコピーします。
2. MCPサーバーを設定する： 以下の特定のクライアント（Claude Code、Cursor、またはその他のMCPクライアント）の設定例を参照してください。

💻 Claude Codeでの使用方法

設定：

Claude CodeのMCP設定に以下を追加します。

オプションA: 環境変数を使用する（推奨 - 最も安全）

{
  "mcpServers": {
    "nano-banana": {
      "command": "npx",
      "args": ["nano-banana-mcp"],
      "env": {
        "GEMINI_API_KEY": "your-gemini-api-key-here"
      }
    }
  }
}

オプションB: 環境変数を使用しない

{
  "mcpServers": {
    "nano-banana": {
      "command": "npx",
      "args": ["nano-banana-mcp"]
    }
  }
}

使用例:

Generate an image of a sunset over mountains

Edit this image to add some birds in the sky

Continue editing to make it more dramatic

🎯 Cursorでの使用方法

設定:

CursorのMCP設定に追加します。

オプションA: 環境変数を使用する（推奨）

{
  "nano-banana": {
    "command": "npx",
    "args": ["nano-banana-mcp"],
    "env": {
      "GEMINI_API_KEY": "your-gemini-api-key-here"
    }
  }
}

オプションB: 環境変数を使用しない

{
  "nano-banana": {
    "command": "npx",
    "args": ["nano-banana-mcp"]
  }
}

使用例:

• Cursorにアプリ用の画像生成を依頼します。
• モックアップやプロトタイプを作成します。
• プロジェクト用のアセットを生成します。

🔧 その他のMCPクライアントでの使用方法

異なるMCPクライアントを使用している場合は、以下のいずれかの方法でnano-banana-mcpを設定できます。

設定方法

方法A: MCP設定の環境変数（推奨）

{
  "nano-banana": {
    "command": "npx",
    "args": ["nano-banana-mcp"],
    "env": {
      "GEMINI_API_KEY": "your-gemini-api-key-here"
    }
  }
}

方法B: システム環境変数

export GEMINI_API_KEY="your-gemini-api-key-here"
npx nano-banana-mcp

方法C: 設定ツールを使用する

npx nano-banana-mcp
# 初回使用時にサーバーが設定を促します
# これにより、現在のディレクトリに.local.nano-banana-config.jsonファイルが作成されます

🛠️ 利用可能なコマンド

generate_image

テキストプロンプトから新しい画像を作成します。

generate_image({
  prompt: "A futuristic city at night with neon lights"
})

edit_image

特定の画像ファイルを編集します。

edit_image({
  imagePath: "/path/to/image.png",
  prompt: "Add a rainbow in the sky",
  referenceImages?: ["/path/to/reference.jpg"] // オプション
})

continue_editing

最後に生成/編集した画像を続けて編集します。

continue_editing({
  prompt: "Make it more colorful",
  referenceImages?: ["/path/to/style.jpg"] // オプション
})

get_last_image_info

最後に生成した画像の情報を取得します。

get_last_image_info()

configure_gemini_token

Gemini APIキーを設定します。

configure_gemini_token({
  apiKey: "your-gemini-api-key"
})

get_configuration_status

APIキーが設定されているかを確認します。

get_configuration_status()

⚙️ 設定の優先順位

MCPサーバーは、以下の優先順位でAPIキーを読み込みます。

1. 🥇 MCP設定の環境変数（最も高い優先度）
   • claude_desktop_config.jsonまたはMCPクライアント設定で設定されます。
   • MCP設定内に含まれるため、最も安全です。
   • 例: "env": { "GEMINI_API_KEY": "your-key" }
2. 🥈 システム環境変数
   • シェル/システム環境で設定されます。
   • 例: export GEMINI_API_KEY="your-key"
3. 🥉 ローカル設定ファイル（最も低い優先度）
   • configure_gemini_tokenツールを使用したときに作成されます。
   • 現在のディレクトリに.nano-banana-config.jsonとして保存されます。
   • GitとNPMによって自動的に無視されます。

💡 推奨事項：セキュリティと利便性のために、方法1（MCP設定の環境変数）を使用することをお勧めします。

📁 ファイル保存

画像は、プラットフォームに適した場所に自動保存されます。

• Windows: %USERPROFILE%\\Documents\\nano-banana-images\\
• macOS/Linux: ./generated_imgs/（現在のディレクトリ）
• システムディレクトリ: ~/nano-banana-images/（システムパスから実行された場合）

ファイル命名規則:

• 生成された画像: generated-[timestamp]-[id].png
• 編集された画像: edited-[timestamp]-[id].png

🎨 例のワークフロー

基本的な画像生成

1. generate_image - 基本画像を作成します。
2. continue_editing - 画像を洗練させて改善します。
3. continue_editing - 最後の仕上げを加えます。

スタイル転送

1. generate_image - 基本コンテンツを作成します。
2. edit_image - 参照画像を使用してスタイルを適用します。
3. continue_editing - 結果を微調整します。

反復的なデザイン

1. generate_image - コンセプトから始めます。
2. get_last_image_info - 現在の状態を確認します。
3. continue_editing - 調整を行います。
4. 満足するまで繰り返します。

🔧 開発

このプロジェクトはClaude Codeで作成され、以下の技術を使用しています。

• TypeScript - 型安全な開発
• Node.js - ランタイム環境
• Zod - スキーマ検証
• Google GenAI - 画像生成API
• MCP SDK - Model Context Protocol

ローカル開発

# リポジトリをクローンする
git clone https://github.com/claude-code/nano-banana-mcp.git
cd nano-banana-mcp

# 依存関係をインストールする
npm install

# 開発モードで実行する
npm run dev

# 本番用にビルドする
npm run build

# テストを実行する
npm test

📋 必要条件

• Node.js 18.0.0以上
• Google AI Studioから取得したGemini APIキー
• Claude Code、Cursor、およびその他のMCPクライアントと互換性があります。

🤝 コントリビューション

このプロジェクトはClaude Codeによって生成されましたが、コントリビューションは大歓迎です！自由に以下のことを行ってください。

• バグを報告する
• 新機能を提案する
• プルリクエストを送信する
• ドキュメントを改善する

📄 ライセンス

MITライセンス - 詳細はLICENSEファイルを参照してください。

🙏 謝辞

• Claude Code - このプロジェクト全体を生成してくれました。
• Google AI - 強力なGemini 2.5 Flash Image APIを提供してくれました。
• Anthropic - Model Context Protocolを提供してくれました。
• オープンソースコミュニティ - 素晴らしいツールとライブラリを提供してくれました。

📞 サポート

• 🐛 問題報告: GitHub Issues
• 📖 ドキュメント: このREADMEとコード内のコメント
• 💬 ディスカッション: GitHub Discussions

✨ Claude Codeによって愛情を込めて生成されました - AIによる開発の未来がここにあります！