/ ディレクトリ / プレイグラウンド / MCP Image
● コミュニティ shinpr 🔑 自分のキーが必要

MCP Image

作者 shinpr · shinpr/mcp-image

Gemini (Nano Banana 2/Pro) 経由で画像を生成および編集 — 自動プロンプト最適化、4K 出力、自然言語編集、文字の一貫性。

mcp-image は、単一の generate_image ツールの背後で Google の Gemini 画像モデル (Nano Banana 2 / Nano Banana Pro) をラップします。 簡単なプロンプトを入力します。 サーバーはモデルを呼び出す前に Subject-Context-Style フレームワークでモデルを強化し、品質レベル (高速/バランス/品質) を選択し、自然言語による画像編集をサポートし、世代間で文字の一貫性を保ちます。 最大 4K 出力、アスペクト比 1:1 ~ 21:9。 無料の Gemini API キーが必要です。

なぜ使うのか

主な機能

ライブデモ

実際の動作

mcp-image.replay ▶ 準備完了
0/0

インストール

クライアントを選択

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "mcp-image": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-image"
      ],
      "env": {
        "GEMINI_API_KEY": "<from aistudio.google.com/apikey>",
        "IMAGE_OUTPUT_DIR": "/absolute/path/to/images"
      }
    }
  }
}

Claude Desktop → Settings → Developer → Edit Config を開く。保存後、アプリを再起動。

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "mcp-image": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-image"
      ],
      "env": {
        "GEMINI_API_KEY": "<from aistudio.google.com/apikey>",
        "IMAGE_OUTPUT_DIR": "/absolute/path/to/images"
      }
    }
  }
}

Cursor は Claude Desktop と同じ mcpServers スキーマを使用。プロジェクト設定はグローバルより優先。

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "mcp-image": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-image"
      ],
      "env": {
        "GEMINI_API_KEY": "<from aistudio.google.com/apikey>",
        "IMAGE_OUTPUT_DIR": "/absolute/path/to/images"
      }
    }
  }
}

Cline サイドバーの MCP Servers アイコンをクリックし、"Edit Configuration" を選択。

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "mcp-image": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-image"
      ],
      "env": {
        "GEMINI_API_KEY": "<from aistudio.google.com/apikey>",
        "IMAGE_OUTPUT_DIR": "/absolute/path/to/images"
      }
    }
  }
}

Claude Desktop と同じ形式。Windsurf を再起動して反映。

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "mcp-image",
      "command": "npx",
      "args": [
        "-y",
        "mcp-image"
      ]
    }
  ]
}

Continue はマップではなくサーバーオブジェクトの配列を使用。

~/.config/zed/settings.json
{
  "context_servers": {
    "mcp-image": {
      "command": {
        "path": "npx",
        "args": [
          "-y",
          "mcp-image"
        ]
      }
    }
  }
}

context_servers に追加。保存時に Zed がホットリロード。

claude mcp add mcp-image -- npx -y mcp-image

ワンライナー。claude mcp list で確認、claude mcp remove で削除。

ユースケース

実用的な使い方: MCP Image

ランディング ページのヒーロー画像を生成して反復する

👤 デザイナー、創業者、マーケティング担当者 ⏱ ~15 min beginner

使うタイミング: 新鮮なヒーロー画像が必要ですが、5 つのタブをやりくりする必要はありません。

前提条件
  • Gemini API キー — https://aistudio.google.com/apikey
  • 出力ディレクトリ — mkdir -p ~/images/mcp
フロー
  1. v1 を生成する
    ヒーロー画像を生成します: 最小限のワークスペース、暖かいゴールデンアワーの光、16:9、品質レベル、2048 ピクセル。✓ コピーしました
    → 強化されたプロンプトがエコーバックされた画像が IMAGE_OUTPUT_DIR に保存されました
  2. その場で編集
    編集します。地平線に細い木の線を追加し、その他はすべてそのままにします。✓ コピーしました
    → バリアントが保存されました。 構成が保存された
  3. バリエーションを試してみる
    同じシーンですが、よりクールなトーンで、被写体を同じに保ちます。✓ コピーしました
    → キャラクターの一貫性は保たれます。 色がずれた

結果: ミッドジャーニーを往復する有料座席ではなく、数分で発送可能なヒーロー イメージです。

注意点
  • オプティマイザーに過剰なプロンプトを表示する — Subject-Context-Style エンハンサにその仕事をさせてください。 5 行の形容詞によるオーバーライドを停止する
組み合わせ: filesystem

ブランドと一貫したイラストのセットを作成する

👤 ブランド資産ライブラリを持たない単独の創業者とデザイナー ⏱ ~45 min intermediate

使うタイミング: 互いに関連しているように見えるイラストが 6 ~ 12 枚必要です。

フロー
  1. スタイルシートを定義する
    スタイル参照を生成します: フラット イラスト、ソフト パステル パレット、2 文字のビネット。✓ コピーしました
    → スタイルを捉えたシード画像
  2. バリエーションを作成する
    そのスタイルを使用して、オンボーディング、請求、チーム、統合、セキュリティ、分析のセクションの 6 つのイラストを作成します。✓ コピーしました
    → 一貫したスタイルと文字を備えた 6 つの画像

結果: イラストレーターを1日雇わずにまとまったイラストセット。

注意点
  • 画像間の漂流 — 常にシード画像を参照し、「シードからスタイルを維持」を使用してください。

自然言語を使用して製品写真を編集する

👤 Eコマース運営者、小規模ブランド ⏱ ~20 min beginner

使うタイミング: 未加工の製品写真があり、Photoshop を使用せずにヒーロー扱いをしたいと考えています。

フロー
  1. 写真をアップロード/参照する
    product.jpg をベースとして使用します。 乱雑な背景を削除します。 影を保ちます。 スタジオの照明。✓ コピーしました
    → 自然な影で撮影されたきれいな製品
  2. コンテキストを追加する
    同じ製品を温かみのある大理石の表面に上から下に置きます。✓ コピーしました
    → 新しい環境でも一貫した製品を提供

結果: カタログに掲載できる画像を数分で作成できます。

組み合わせ: filesystem

組み合わせ

他のMCPと組み合わせて10倍の力を

mcp-image + filesystem

画像ライブラリを生成、リスト、タグ付け、整理する

今日のセットを ~/images/mcp/2026-04-21/ に生成します。 次に、代替テキストをリストして名前を変更します。✓ コピーしました
mcp-image + magic-ui-mcp

生成されたヒーロー画像を Magic UI ランディングにドロップします

ヒーロー イメージを生成し、それを Magic UI ヒーロー コンポーネントに接続します。✓ コピーしました
mcp-image + comfyui-mcp-server

1 回限りの生成には mcp-image を使用します。 パイプライン用の ComfyUI

mcp-image によるクイック バリアント。 ComfyUI を介した制作ワークフロー。✓ コピーしました

ツール

このMCPが提供する機能

ツール入力呼び出すタイミングコスト
generate_image prompt: str, tier?: fast|balanced|quality, aspect?: '1:1'|'16:9'|..., base_image?: path, size?: '1K'|'2K'|'4K' 新しい画像を生成するか、自然言語を使用して既存の画像を編集します 1 Gemini image call

コストと制限

運用コスト

APIクォータ
Gemini API プランのイメージ生成割り当ての制限を受ける
呼び出しあたりのトークン
テキストとしては無視できます。 画像バイトが優勢
金額
Gemini API 経由のペイパーイメージ。 開発に利用可能な無料利用枠
ヒント
反復には tier=fast を使用し、最終キーパーには tier=quality のみを使用します。

セキュリティ

権限、シークレット、影響範囲

認証情報の保管: 環境内の GEMINI_API_KEY のみ — 決してコミットしないでください。 漏洩した場合は Google AI Studio からローテーションします。
データ送信先: プロンプトとオプションの基本イメージは、Google の Gemini API に送られます。 生成されたバイトは返され、ローカルに保存されます。

トラブルシューティング

よくあるエラーと対処法

401 / APIキーが無効です

GEMINI_API_KEY が AI Studio の生の API キー (OAuth トークンではない) であり、イメージ生成が有効になっていることを確認します。

確認: curl https://generativelanguage.googleapis.com/v1beta/models?key=$GEMINI_API_KEY
出力は保存されましたが空です

IMAGE_OUTPUT_DIR が書き込み不可能であるか、欠落している可能性があります。 作成して再試行してください。

確認: touch $IMAGE_OUTPUT_DIR/.probe && rm $IMAGE_OUTPUT_DIR/.probe
性格は世代間で漂流する

常に同じbase_imageを渡し、プロンプトに「件名を同一にする」を含めます。

確認: Diff two generations visually

代替案

MCP Image 他との比較

代替案代わりに使う場面トレードオフ
everartスタイルトレーニングされた Everart モデルがいますプロバイダーが異なれば、適用範囲も異なります
comfyui-mcp-serverカスタム SD/FLUX ワークフローと完全なパイプライン制御が必要ですはるかに重いセットアップ
higgsfield-ai-prompt-skill別のプロバイダーに対する迅速なエンジニアリング サポートが必要な場合プロンプトのみ - 推論なし

その他

リソース

📖 GitHub の公式 README を読む

🐙 オープンな issue を見る

🔍 400以上のMCPサーバーとSkillsを見る