mcpField
G
generate-image

generate-image

github.com/b-open-ioクリエイティブ・メディア1253 回インストール5 週間前に更新
リポジトリ

generate-image について

Nano Banana Pro を使って画像を生成するコマンドラインスキルで、Gemini、OpenAI、xAI からプロバイダーを選べます。プロンプトの準備、スタイル選択、参照画像の利用、下書きから完成版への反復を案内します。

主な機能

  1. 01テキストプロンプトから画像を生成
  2. 02スタイルライブラリからスタイルを選択
  3. 03参照画像を使ったバリエーション作成
  4. 04サイズ、縦横比、出力設定の指定
  5. 05Gemini、OpenAI、xAI の選択

活用シーン

  1. 01アートやイラストの作成
  2. 02参照画像を使ったバリエーション生成
  3. 03ソーシャル共有画像の作成
  4. 04下書きから高解像度版への反復

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/b-open-io/gemskills --skill generate-image

インストール後、Claude Code で/generate-imageを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

.clawnet/
unsigned-skill.json
references/
prompt-guide.md
scripts/
generate.ts

詳細

画像を生成する

Nano Banana Pro(gemini-3-pro-image)を使用して画像を生成します。

使用するタイミング

ユーザーから次のような依頼があった場合に、このスキルを使用します。

  • テキストプロンプトから画像を生成する
  • アート作品、イラスト、またはグラフィックを作成する
  • 既存の画像のバリエーションを生成する(img2img)
  • 複数の参照画像(キャラクター+場所+その他のキャラクター)を使ってシーンを作成する

スタイルの選択

ユーザーがスタイルを指定していない場合は、作業を始める前に選択肢を提示します。

アートスタイルをどのように決めますか?

  1. スタイルを選ぶ - 167 種類のスタイルを視覚的に見て選ぶ
  2. おまかせにする - プロンプトに基づいてスタイルを提案してもらう
  3. スタイルとは? - スタイルシステムの仕組みを確認する
  4. スタイルを指定しない - 特定のアートスタイルを指定せずに生成する

この選択肢の提示には AskUserQuestion ツールを使用します。

ユーザーが「スタイルを選ぶ」を選んだ場合は、スタイル選択画面を起動します(デフォルトで選択モードです)。

STYLE_JSON=$(bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/browsing-styles/scripts/preview_server.ts)

選択画面がブラウザーで開きます。ユーザーがスタイルをクリックして詳細モーダルを確認し、「Select This Style」をクリックします。STYLE_JSON に選択内容が JSON として格納され、サーバーが終了します。id フィールドを解析し、生成コマンドに --style <id> として渡します。

ユーザーが「おまかせにする」を選んだ場合は、プロンプトに最も合うスタイルを選び、その理由を説明します。以下の「ユーザーにスタイルを提案する」セクションにあるスタイルの提案を使用してください。

ユーザーが「スタイルとは?」を選んだ場合は、10 のカテゴリー(伝統、デジタル、イラスト、写真、デザイン、レトロ、技法、装飾、クリエイティブ、文化)にわたる 167 種類の厳選されたアートスタイルがあることを説明します。各スタイルにはプロンプトのヒントと視覚的な参照タイルが含まれており、Gemini に送信することでスタイルをより忠実に反映できます。その後、スタイルに関する質問をもう一度提示します。

ユーザーがすでにスタイルを指定している場合(例:「水彩画風で生成して」)は、この手順を省略し、--style を直接使用します。

まずデザインの方向性を確認する

プロンプトを書き換える前に、ユーザーの意図を理解するための確認質問をします。

  1. 用途:画像は何に使いますか?(バナー、ロゴ、ソーシャルメディア、商品写真、アート作品)
  2. 配色:ブランドカラーはありますか?ダークテーマとライトテーマのどちらですか?特定の雰囲気を希望しますか?
  3. 構図の制約:アスペクト比の要件はありますか?テキストを重ねるスペースは必要ですか?全面に画像を配置しますか、それとも枠線を付けますか?
  4. 重要な要素:必ず含めるものは何ですか?避けるべきものはありますか?

「猫の画像を作って」のような簡単な依頼なら、適切なデフォルトを使って進められます。「アプリ用のバナーを作成して」のような複雑な依頼では、やり直しを減らすために確認が必要です。

プロンプトの書き換え(重要)

画像を生成する前に必ず、references/prompt-guide.md のガイドを使ってユーザーのプロンプトを書き換えます。

基本原則:「キーワードを並べるのではなく、シーンを描写する。」

書き換えのチェックリスト

簡単なプロンプトに次の要素を加えて、内容を具体化します。

  1. 被写体の詳細:具体的な外見、服装、表情、素材
  2. 環境・舞台:場所、時間帯、天候、屋内・屋外
  3. 照明:自然光・人工光、方向、質、色温度
  4. 構図:カメラアングル、距離、フレーミング、焦点距離
  5. スタイル・美的表現:フォトリアリスティック、イラストのスタイル、芸術運動
  6. ムード・雰囲気:感情的なトーン、配色の雰囲気
  7. 技術仕様:アスペクト比、ディテールの度合い、テクスチャ
変換例

ユーザーの入力:「自分のアプリ用のバナー」 書き換え後のプロンプト:「テクノロジーアプリ向けの、モダンなフルブリードのバナー。濃紺から黒へと変化する暗いグラデーション背景。細い線でつながった発光するノードによる、抽象的な幾何学的ネットワークのビジュアル。中央より左に配置された、すっきりしたサンセリフ体のタイポグラフィ。目に見える境界線や端がなく、デザインがすべての端までシームレスに広がる、プロフェッショナルで先進的なテクノロジーの美学。アスペクト比16:9。」

ユーザーの入力:「猫」 書き換え後のプロンプト:「日差しが降り注ぐ窓辺でくつろぐ、ふわふわしたオレンジ色のトラ猫。柔らかな午後の光が毛並みに温かな輝きを与えています。猫は目を半分閉じたリラックスした姿勢で、満ち足りた様子を見せています。浅い被写界深度を用いて低いアングルから撮影し、背景にはぼかした庭の景色が見えます。フォトリアルで、温かみのある色調。」

推奨ワークフロー

下書き → 改良 → 最終版のアプローチで、時間とAPIコストを節約できます。

  1. 下書きフェーズ(1K):デフォルトの解像度で手早く生成し、プロンプトを試します
  2. 反復フェーズ:プロンプトを少しずつ調整し、試すたびに新しいファイルを作成します
  3. 最終フェーズ(4K):プロンプトの検証が済んでから、高解像度の出力を生成します

画像を読み戻さないでください。スクリプトはファイルパスのみを出力します。これにより、Claude に大きな画像データを読み込ませず、効率的に反復できます。

使い方

bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "prompt" [options]
オプション
  • --input <path> - 参照画像(最大14枚まで複数指定可能)
  • --style <id> - スタイルライブラリのスタイルを適用します(browsing-styles スキルを参照)
  • --size <1K|2K|4K|WxH> - 画像サイズ(デフォルト:モデルが決定)。1K/2K/4K はすべてのプロバイダーでピクセル予算を設定します。openai では正確な WxH も指定できます。例:3840x1280。
  • --aspect <ratio> - gemini:1:1、2:3、3:2、3:4、4:3、4:5、5:4、9:16、16:9、21:9。openai:1:3から3:1までの任意の W:H(例:横長のバナーには 3:1)。--size WxH と併用しないでください。
  • --quality <low|medium|high|xhigh|max|auto> - openai のみ(デフォルトは auto)。xhigh と max は Image 2.5 で新たに追加されました。Gemini と xai はこのフラグを受け付けません。
  • --negative <prompt> - ネガティブプロンプト(避けたい要素)
  • --count <n> - 画像の枚数(1~4、デフォルト:1)
  • --guidance <n> - ガイダンススケール
  • --seed <n> - 再現性のための乱数シード
  • --output <path> - 出力パス
  • --transparent - 透明/アルファ背景(OpenAI では background=transparent。Gemini でも使用可能)
  • --provider <name> - gemini、openai、または xai。省略すると、リクエストに最適な利用可能プロバイダーが自動選択されます(Models を参照)。
  • --model <id> - OpenAI Image 2.5 のバリアント:flare/gpt-image-2.5-flare(デフォルト)または sunburst/gpt-image-2.5-sunburst。プロバイダーを openai に設定します。従来のプロバイダーエイリアス gemini|openai|xai|grok も引き続き使えますが、非推奨です。--provider を使用してください。
例
# Simple generation
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "cyberpunk cityscape at night"

# With art style (100+ available, use short names or full IDs)
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "mountain landscape" --style impressionism
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "portrait" --style ukiy
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "city street" --style noir

# High-res with specific aspect ratio
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "mountain landscape" --size 4K --aspect 16:9

# With negative prompt
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "portrait of a cat" --negative "low quality, blurry"

# Combine style with other options
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "cat sleeping" --style wtrc --size 4K --aspect 1:1

# Generate multiple variations
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "abstract art" --count 4

# Single reference image (img2img)
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "make it look like a watercolor painting" --input photo.jpg

# Multiple reference images (character consistency, scene composition)
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "King on throne in dramatic lighting" \
  --input character.png \
  --input throne-room.png \
  --aspect 16:9 --size 2K

# Multiple characters in a scene
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "Two warriors facing each other in combat" \
  --input warrior1.png \
  --input warrior2.png \
  --input battlefield.png \
  --aspect 16:9

複数の参照画像

Gemini は1回のリクエストにつき、最大14枚の参照画像に対応しています。

  • 物体6点 - 場所、アイテム、環境
  • 人物5人 - 生成間でキャラクターの一貫性を保つ
  • 参照画像の組み合わせ方を詳細に説明するプロンプトを使用します
  • 参照画像は、シーンを生成する際の一貫性の維持に役立ちます

よく使われる形式

形式アスペクト比推奨サイズトリミング先
OG/ソーシャル共有16:92Ksips で 1200x630
Twitter カード16:92Ksips で 1200x628
ヒーローバナー16:94K全幅
プロフィール画像1:11K512x512 または 1024x1024
ストーリー/リール9:162K1080x1920
チームの集合写真21:92K全幅
ソーシャル共有画像のワークフロー

4つの手順はすべて必須です。最適化を省略しないでください。

  1. 生成:レティナ対応の --size 2K で、中心に重みを置いたプロンプトを使い、16:9で生成します。
    bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "CENTER all important elements, no content near edges. [your prompt]" --aspect 16:9 --size 2K --output social-share.png
    
  2. トリミング:プラットフォームに合わせて正確な寸法にします。
    sips -z 630 1200 -c 630 1200 social-share.png --out social-share-og.png   # OG
    sips -z 628 1200 -c 628 1200 social-share.png --out social-share-tw.png   # Twitter
    
  3. 最適化:品質85%のJPEGに変換します(ソーシャル画像に透明度は不要です)。
    sips -s format jpeg -s formatOptions 85 social-share-og.png --out social-share-og.jpg
    
  4. 確認:寸法とファイルサイズを確認します。
    sips -g pixelWidth -g pixelHeight social-share-og.jpg
    ls -la social-share-og.jpg  # Target: <500KB
    

最適化が必要な理由:Gemini の出力は PNG で、サイズは約1~2MBです。品質85%のJPEGなら、目に見える品質の低下なしに約200~400KBまで縮小できます。ソーシャルプラットフォームはアップロード画像を再圧縮するため、最初から最適化したJPEGを使用すれば、二重圧縮によるアーティファクトを防げます。

利用可能なスタイル

9つのカテゴリー(伝統芸術、デジタル、イラスト、写真、デザイン/UI、レトロ、技法、装飾、クリエイティブ/素材ベース)にわたり、100種類以上のスタイルがあります。

タイルの参照画像(assets/tiles/<id>.png)があるスタイルでは、プロンプトのヒントとともにその画像が視覚的な参照として Gemini に自動送信され、スタイルへの忠実度が大幅に向上します。

ユーザーにスタイルを提案する

画像を生成するときは、関連するスタイルを積極的に提案してください。

  • 風景には:impr、roma、wtrl、cine
  • ポートレートには:barq、prer、anim、fnoi
  • UI/ウェブには:brut、nbrt、glas、flat
  • レトロ/ヴィンテージには:y2k、frug、psyc、koda
  • whimsical/楽しい雰囲気には:ghbl、kawa、chld、brit
  • ドラマチックな表現には:cybr、nnoi、surr、expr
  • クリエイティブな表現には:sand、undr、orig、clay、lego

一覧を見る:bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/browsing-styles/scripts/list_styles.ts --table 検索する:bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/browsing-styles/scripts/list_styles.ts --search "watercolor"

モデルとプロバイダー

プロバイダーは3種類あり、--provider で選択するか、省略した場合は自動選択されます。

プロバイダーモデルキー強み対応していない機能
gemini(デフォルトのフォールバック)gemini-3-pro-image(Nano Banana Pro)GEMINI_API_KEYスタイルタイル、最大14枚の参照画像、専用のネガティブプロンプト、透明度、1K/2K/4K—
openaigpt-image-2.5-flare(Flare、デフォルト)/gpt-image-2.5-sunburst(Sunburst、--model sunburst)OPENAI_API_KEY画像内のテキスト、照明/テクスチャ、複雑な指示、詳細なレイアウト、透明な背景、最大3840pxの辺長と1:3~3:1のアスペクト比に対応したカスタムサイズ、最大maxの品質、画像から画像への生成(--input、最大16枚、編集エンドポイント経由)に最適スタイルタイル非対応、専用のネガティブパラメーター非対応
xaigrok-imagine-image-qualityXAI_API_KEY高速で、より刺激的な表現に対応。Gemini のフィルターが無害なプロンプトをブロックするときに有効テキストから画像への生成のみ。画像から画像への生成/タイル/ネガティブプロンプトには非対応
自動選択(--provider を省略した場合のデフォルト)

スクリプトは、キーが設定されていて、リクエストに必要な機能に対応するプロバイダーの中から最適なものを選びます。優先順位は openai > gemini > xai です。

--input(画像から画像への生成/参照画像)は、openai と gemini の両方で使用できます。openai は Image 2.5 の編集エンドポイント経由、gemini は Nano Banana Pro 経由で処理します(Nano Banana Pro はスタイルタイルと最大14枚の参照画像にも対応しています)。そのため、画像から画像への生成では、openai のキーが設定されている場合は openai が自動選択されます。Gemini のスタイルタイルや複数の参照画像を使った合成には、--provider gemini を指定してください。

--transparent は openai と gemini に対応しています(OpenAI は background=transparent を渡します)。ただし、リクエストで --style(スタイルタイル)または --negative(専用のネガティブパラメーター)を使う場合、機能要件によって Gemini が強制的に選ばれます。これらに対応しているのは Gemini のみです。/gemskills:setup または GEMSKILLS_IMAGE_PROVIDER でデフォルトを固定できます。

openai が選択され、--style が指定されている場合は、スタイルのタイル画像が除外されます(テキストのヒントは引き続き適用されます)。また、--negative は Avoid: … という節としてプロンプトに組み込まれます。xAI ではさらに、参照画像も除外されます(テキストから画像への生成のみ)。

プロンプトテンプレート(プロバイダーごとに調整)

プロバイダーごとにプロンプトの解析方法が異なります。プロバイダーの解決後、該当するガイドを読み、プロンプトを書き換えてください。

  • providers/prompts/image.gemini.md
  • providers/prompts/image.openai.md
  • providers/prompts/image.xai.md
# Force a provider / Image 2.5 variant
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "neon city street, rain" --provider openai --size 4K --quality high
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "panoramic website footer city" --model sunburst --aspect 3:1 --size 4K   # 3840x1280
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "app icon, rounded square" --model sunburst --transparent
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-image/scripts/generate.ts "watercolor fox" --provider xai
OpenAI のサイズ規則(Image 2.5)

API が受け付けるのは auto または WIDTHxHEIGHT です。幅と高さはどちらも 16 で割り切れる必要があり、アスペクト比は 1:3〜3:1、最大辺は 3840、総ピクセル数は 655,360〜8,294,400 である必要があります。スクリプトは --size の段階と --aspect から有効なサイズを計算し、API が拒否するサイズの場合はエラーで停止します。無効なサイズを auto に変更することはありません。2560x1440 を超えるサイズは、OpenAI によると実験的なものです。input_fidelity は Image 2.5 ではサポートされていないため、送信されることはありません。

コストは、公開されているトークンごとの価格(テキスト入力 $5、画像入力 $8、画像出力 100 万トークンあたり $30)を使って、レスポンスの usage から表示されます。価格情報のないモデルでは、「価格データなし」と表示されます。

ライブ環境での検証済みモデル:2026 年 9 月(gpt-image-2.5-flare、gpt-image-2.5-sunburst、grok-imagine-image-quality、gemini-3-pro-image)。より新しい世代が存在する場合は、停止して b-open-io/gemskills への PR を提案してください。

参考ファイル

プロンプト作成の戦略と手法について詳しくは、以下をご覧ください。

  • references/prompt-guide.md - Google の公式ドキュメントに基づく、7 つの戦略、変換例、ベストプラクティスを含む包括的な Gemini プロンプトガイド
  • ask-gemini スキルの references/gemini-api.md - 最新の Gemini モデル、SDK 情報、llms.txt を使った動的なドキュメント

コメント