公開日: 最終更新:
執筆・編集：株式会社Nexa 編集部（下書きと機械検査はAI、公開前に人が確認）／約16分で読めます。公式ドキュメント・公式発表などの一次情報を確認したうえで執筆・更新しています。AIツールの仕様や料金は変わることがあるため、導入判断の前に各公式サイトの最新情報もご確認ください。記事の作り方と検査の方針
Claudeは単体では画像生成できません。ただしClaude CodeからGemini APIを呼び出せば、SEO記事のサムネイル画像をコマンド1つで自動生成し、ブランドを統一したアイキャッチを量産できます。
- 要点1: Claude自体に画像生成モデルは無く、画像を作るにはSVG/HTML生成・画像生成API連携・MCP連携のいずれかが必要（本記事はAPI連携＝Gemini APIを扱う）
- 要点2: Gemini APIの画像生成（Nano Banana 2／flash2モデル）は日本語テキスト描画精度が高く、企業メディアのサムネイル量産に適している
- 要点3: カラーパレット6色とモチーフ辞書30種以上のテンプレートを用意することで、記事ごとに表情を変えながらブランドを統一できる
- 要点4: SKILL.mdでワークフロー化すれば「記事タイトルを渡すだけ」でサムネイル生成からWordPressへのアップロードまで完結する
対象: Claude CodeでSEO記事を運営しており、サムネイル作成の工数を削減したいメディア担当者・コンテンツマーケター
今日やること: Google AI StudioでGemini APIキーを取得し、まず1枚試し生成してみる
結論から言うと、Claudeは単体では画像生成できません。Claude CodeとGemini APIを組み合わせることで、SEO記事のアイキャッチ画像をコマンド1つで自動生成できます。
「記事は書けるようになったけど、サムネイルが毎回手間」「Canvaで1枚ずつ作るのに30分かかっている」——こうした課題を抱えるメディア担当者は少なくありません。
あるメディアサイトでは、Claude Codeのカスタムスキルを構築し、記事タイトルを渡すだけでブランドを統一したサムネイルを自動生成する仕組みを実現しました。この記事では、その実装手順・プロンプト設計・遭遇したトラブルと解決策を具体的に解説します（2026年10月1日に本文中の公式ページ・料金・モデル名を確認済み）。
Claude Codeで画像を生成する仕組み
Claude自体は画像を生成する機能を持っていません。しかし、Claude CodeからGemini APIを呼び出すスクリプトを実行することで、テキストプロンプトを画像に変換することができます。
画像生成の3つの方法と、この記事がAPI連携を選ぶ理由
Claude Codeで画像を作る方法は、大きく分けて3つあります。①SVG・HTMLをClaude Codeに生成させる方法、②Gemini APIなどの画像生成APIをスクリプトから呼び出す方法、③画像生成のMCPサーバーと連携する方法です。3方法の使い分けは「Claude Codeで画像生成する3つの方法」で比較しています。本記事はこのうち②のAPI連携を、SEO記事のサムネイル自動生成という具体的な用途に絞って、プロンプト設計から運用の自動化まで深掘りする実践編です。
Claude × Gemini連携の構成図
全体の流れは以下のとおりです。
| ステップ | 処理内容 |
|---|---|
| 1 | Claude Codeがプロンプトを自動構築（記事タイトル・カテゴリ・カラーパレットから） |
| 2 | Pythonスクリプト（nano-banana）がGemini APIにリクエストを送信 |
| 3 | Geminiが画像を生成し、PNG形式でローカルに保存 |
| 4 | 必要に応じてWP-CLI経由でWordPressへ自動アップロード |
Claude Codeは「指示を出す側」、Geminiは「実際に画像を生成する側」という役割分担です。この構成にすることで、Claude Codeの柔軟なテキスト処理能力と、Geminiの高品質な画像生成能力をそれぞれ活かせます。
使用するGeminiモデルの選び方
Gemini APIには複数の画像生成モデルがあります。サムネイル生成での推奨は以下のとおりです。
| モデル | 特徴 | 用途 |
|---|---|---|
--model flash（gemini-2.5-flash-image） |
旧世代モデル。Googleは新規利用ではNano Banana 2への移行を推奨 | 動作確認・過去との比較用途 |
--model flash2（gemini-3.1-flash-image／Nano Banana 2） |
512px〜4K解像度に対応。速度と高解像度出力・テキストレンダリングのバランスが良い | 推奨。サムネイル量産の標準（デフォルト） |
--model pro（gemini-3-pro-image／Nano Banana Pro） |
1K/2K/4Kに対応。複雑なレイアウト・高精度なテキスト生成が必要な場合の最上位モデル。処理は遅め | 商業印刷レベルの品質が必要な場合 |
| gemini-3.1-flash-lite-image（Nano Banana 2 Lite） | flash2よりさらに低コスト・低遅延な軽量版。品質はflash2よりやや簡素 | サムネイルの大量試作・下書き確認用途 |
あるメディアサイトでは当初Proモデルを使用していましたが、Flash2でも品質が十分だと確認でき、速度とコストのバランスからFlash2（flash2）に切り替えました。日本語テキストの描画崩れも発生しておらず、現在は全サムネイル生成をflash2で運用しています（2026年10月1日時点のモデル名・対応解像度はGemini APIの公式モデル一覧で確認できます）。
Gemini API（Nano Banana）のセットアップ手順
Google AI StudioでAPIキーを取得する
- Google AI Studio にアクセス
- Googleアカウントでサインイン
- 「APIキーを作成」をクリックし、プロジェクトを選択
- 表示されたAPIキー（
AIzaSy〜の形式）をコピーしておく
APIキーの取得自体は無料ですが、画像生成の実行には無料枠がなく、生成した枚数に応じた従量課金になります（2026年9月時点）。Flash2（Nano Banana 2）は1K解像度で1枚あたり0.1米ドル未満と比較的低コストで、月100〜200枚程度の生成でも月あたり数千円程度に収まることが多い水準です。解像度を上げるほど単価も上がるため、最新の料金は後述のFAQで案内する公式の料金ページで確認してください。
macOS KeychainへのAPIキー登録
APIキーをスクリプトに直接埋め込むのはセキュリティ上のリスクがあります。macOSのKeychainを使って安全に管理しましょう。
# Keychainにアンロックしてから登録（初回のみ）
security unlock-keychain ~/Library/Keychains/login.keychain-db
# APIキーを登録
security add-generic-password -a "riku" -s "GEMINI_API_KEY" -w "あなたのAPIキー" -Uポイント
security add-generic-passwordを実行すると「User interaction is not allowed」というエラーが出ることがあります。これはKeychainがロック状態のサインです。先にsecurity unlock-keychainコマンドでロックを解除してから再実行してください。
Pythonスクリプト（nano-banana）の準備
Gemini APIへのリクエストを送るPythonスクリプトを用意します。依存ライブラリのインストールは以下のとおりです。
# 仮想環境を作成して有効化
python3 -m venv /tmp/nano-banana-venv
source /tmp/nano-banana-venv/bin/activate
# 必要なライブラリをインストール
pip install google-genai Pillowスクリプト自体はKeychainからAPIキーを自動取得し、プロンプトを受け取って画像を生成・保存する構成にします。これにより、毎回APIキーを指定せずに実行できます。
サムネイル生成プロンプトの設計法
サムネイル生成で最も重要なのが「プロンプトの設計」です。1枚ずつ違うプロンプトを書いていては再現性がなく、ブランドもバラバラになります。テンプレート化が鍵です。
ベーステンプレートの構造（3層構成）
実際に運用しているあるメディアサイトでは、以下の3層構成のプロンプトテンプレートを採用しています。
| 層 | 役割 | 主な変数 |
|---|---|---|
| 背景層 | 単色のダークトーン背景 + 英語キーワードのゴースト文字テクスチャ | {BG_COLOR}, {KW_EN_1}, {KW_EN_2} |
| オブジェクト層 | テーマに合ったヒーローオブジェクトを右寄りに配置。発光色で存在感を出す | {HERO_OBJECT} |
| テキスト層 | 日本語のメインタイトル・サブタイトルを左寄りに大きく配置 | {MAIN_TITLE}, {SUB_TITLE} |
この3層構造はadobe系デザインソフトのレイヤー概念をプロンプトで再現したものです。各変数を差し替えるだけで、異なるテーマの記事でも一貫したデザインを保てます。
カラーパレットで記事ごとに表情を変える
ブランドを統一しながらも単調にならないよう、記事カテゴリ・テーマに応じて背景色を使い分けます。
| 色名 | 用途の目安 |
|---|---|
| ディープネイビー（#1a1a3e） | AI全般、テクノロジー系のデフォルト |
| チャコールブルー（#111827） | 導入事例、ビジネス実践系 |
| ダークティール（#0A3D5C） | DX、イノベーション、変革系 |
| リッチインディゴ（#2D1B69） | 生成AI、クリエイティブ系 |
| ダークスレート（#1E293B） | 手順・ガイド、How-to系 |
| ミッドナイトグリーン（#0C3B2E） | サステナビリティ、長期戦略系 |
連続する記事で同じ背景色を使わないルールを設けることで、メディアのトップページやカテゴリページで並べたときに視覚的な単調さを防げます。
日本語テキストの描画精度を上げるコツ
Geminiで日本語サムネイルを生成する際、テキストが崩れたり小さくなったりすることがあります。以下のポイントを守ることで精度が大幅に改善します。
- 引用符で囲む:
"{MAIN_TITLE}"のように日本語テキストを必ず引用符で囲む - 8文字以内に収める: メインタイトルは1行あたり最大8文字。それ以上だと文字が小さくなる
- billboard-scale を明示: プロンプトに「the headline must be the single largest element, occupying at least one-third of the image height」と明記する
AI導入に関するお困りごとは、株式会社NexaのAI顧問がサポートします。「何から始めればいいか分からない」という段階からご相談いただけます。
実際に生成してみる — コマンドと結果
生成コマンドの全体像
以下が実際にサムネイルを生成するコマンドの例です。
source /tmp/nano-banana-venv/bin/activate && \
python3 ~/.claude/skills/nano-banana/scripts/generate_image.py \
--prompt "A clean and sophisticated campaign poster. Full-bleed dark teal (#0A3D5C) canvas. Ghost texture: 'AI' and 'AUTOMATION'. Hero: holographic brain with cyan glowing synaptic pathways, right-side. Headline: 'AI自動化' ultra-bold billboard-scale white, left. Sub: '記事サムネイル生成'" \
--output "~/Desktop/記事/sample/thumbnail.png" \
--model flash2 \
--aspect-ratio "16:9" \
--resolution 2K--model flash2 でGemini Flash2を指定し、--resolution 2K で高解像度出力を指定します。生成にかかる時間は10〜30秒程度です。
記事テーマ別の生成例
あるメディアサイトで実際に生成した3パターンの例です（サイト名・記事タイトルは変更）。
| テーマ | 背景色 | ヒーローオブジェクト | 結果 |
|---|---|---|---|
| AI全般の解説記事 | ダークティール | 発光するシアンのホログラム脳 | テキスト正確・視認性◎ |
| 導入事例記事 | リッチインディゴ | ゴールドアクセントのAIチップを持つロボットアーム | コーポレート感◎ |
| トレンド速報記事 | チャコールブルー | コーラルレッドのロケット | インパクト◎ |
3枚ともブランドのトーンマナー（ダーク背景×白テキスト×発光モチーフ）を保ちながら、テーマに応じた表情の違いが出ています。
生成結果のチェックポイント
生成された画像は以下の観点で確認します。問題があれば、プロンプトを微調整して再生成します。
- テキスト描画: 日本語タイトルが正確に描かれているか（1〜2文字の入れ替わりが稀に発生）
- コントラスト: 白テキストと背景色の差が十分か
- オブジェクト配置: ヒーローオブジェクトがテキストに被っていないか
- 全体の印象: ミニマル・コーポレートの雰囲気が保たれているか
Claude Codeのスキルとして体系化する方法
単発コマンドをその都度実行するのではなく、SKILL.md でワークフロー化しておくことで、「記事タイトルとカテゴリを渡すだけ」でサムネイル生成が完結します。
SKILL.mdの基本構造
---
name: nexa-media-thumbnail
description: サムネイル生成スキル
---
## ワークフロー
1. 記事タイトル・カテゴリ・KW名を受け取る
2. カテゴリに応じたカラーパレットを選択
3. テーマに対応したヒーローオブジェクトをテンプレートから選択
4. プロンプトテンプレートに変数を埋め込む
5. nano-bananaスクリプトを実行して画像を生成
6. 生成結果を確認（ファイルサイズ・解像度）
7. 記事フォルダに thumbnail.png として保存この形式で定義しておくと、Claude Codeがスキルを参照してサムネイル生成の全ステップを自動で実行します。
記事タイトルからプロンプトを自動構築するロジック
Claude Codeは記事タイトルからプロンプトの変数を自動判断します。
- BG_COLOR: カテゴリ・テーマから適切な背景色を選択（例: 導入事例 → チャコールブルー）
- HERO_OBJECT: テーマキーワードに対応したモチーフを辞書から選択（例: 業務効率化 → 浮遊するデジタルスクリーン）
- MAIN_TITLE: 記事タイトルを8文字以内に短縮してインパクト重視で再構成
- SUB_TITLE: 補足情報をサブタイトルとして15文字以内で設定
この自動化により、毎回プロンプトをゼロから考える必要がなくなります。
WordPress（WP-CLI）への自動アップロードまでをワンコマンドに
生成したサムネイルはSSH経由でWordPressサーバーに転送し、WP-CLIでアイキャッチ画像として設定します。
# サーバーに転送してメディアインポート
scp thumbnail.png conoha:/tmp/nexa-thumb.png
ATTACHMENT_ID=$(ssh conoha "php ~/wp-cli.phar \
--path=\$HOME/public_html/your-site/ \
media import /tmp/nexa-thumb.png \
--title='記事タイトル アイキャッチ' \
--alt='AIサムネイル生成のイメージ画像' \
--porcelain")
# アイキャッチ画像として設定
ssh conoha "php ~/wp-cli.phar \
--path=\$HOME/public_html/your-site/ \
post meta update $POST_ID _thumbnail_id $ATTACHMENT_ID"この手順をスキルに組み込んでおけば、記事公開ワークフローの中でサムネイルのアップロードも自動的に行われます。
遭遇したトラブルと解決策
実際に運用する中でいくつかのトラブルに遭遇しました。同じ問題で詰まる方のために共有します。
KeychainがロックされていてAPIキーを取得できない
スクリプト実行時に security: User interaction is not allowed. というエラーが発生することがあります。
原因: macOSのKeychainがロックされている状態。スリープ復帰直後や、ターミナル起動直後に起きやすい。
解決策:
# Keychainをアンロックしてから再実行
security unlock-keychain ~/Library/Keychains/login.keychain-db
# ↑ Macのログインパスワードを入力
# その後、通常通りスクリプトを実行また、security add-generic-password でAPIキーを登録する際は、アカウント名（-aオプション）をスクリプト内の検索条件と一致させる必要があります。Keychainに gemini で登録していたのに、スクリプトが riku（macOSユーザー名）で検索して見つからないケースが実際にありました。
日本語テキストが文字化けする・小さすぎる
原因: プロンプトに日本語テキストを直接書いても、Geminiが正確に描画しないことがある。
解決策:- 引用符で囲む（"AI自動化" のように）- テキストが長すぎる場合は分割する（メインタイトル8文字・サブタイトル15文字以内）- the headline must occupy at least one-third of the image height という制約を明示する
モデル選択で生成品質が大きく変わる
Proモデルは高品質だが処理が遅く、Flash2は速くて品質も十分——という判断をするには実際に比較するのが早いです。あるメディアサイトでは同じプロンプトでProとFlash2を比較した結果、Flash2のほうがテキストレイアウトが整っているケースもありました。
ポイント最初はFlash2で生成し、品質に不満があればProモデルで再試行する、というアプローチが効率的です。Proは処理時間が数倍かかり、API費用も高くなります。
＼ AI活用の「次の一手」を一緒に考えませんか ／
AI顧問の無料相談はこちらよくある質問
Q. Claudeそのもの（Claude Codeを使わず）で画像生成はできますか？
いいえ、できません。Anthropicの公式ドキュメントでも、Claudeは画像を理解するモデルであり、新しいイラストや写真を生成する機能は持たないと説明されています。Claude Codeから画像を作るには、本記事で扱うGemini APIなどの画像生成APIを呼び出す方法、SVG・HTMLをClaude Codeに生成させる方法、画像生成のMCPサーバーと連携する方法のいずれかが必要です。
Q. Claude Codeを使わずGemini APIだけでサムネイルは生成できますか？
はい、可能です。Googleが提供するGoogle AI Studioのウェブ画面から、プロンプトを入力して画像生成できます。ただし、記事タイトルからプロンプトを自動構築したり、WordPressへの自動アップロードまで繋げたりするには、Claude Codeによる自動化が必要です。
Q. 生成した画像の商用利用は問題ありませんか？
Google公式のGemini API利用規約によると、生成したコンテンツの所有権はユーザーに帰属し、商用利用は認められています。ただし無料枠（Unpaid Services）を使う場合、Googleがそのプロンプト・生成物を製品改善に利用する権利を保持する点に注意が必要です。有料プラン（Paid Services）ではこの利用がされないと明記されているため、商用でサムネイルを量産する場合は有料枠の利用を確認してください（2026年10月1日にGemini API利用規約で確認）。
Q. 画像生成の費用はどのくらいかかりますか？
Gemini APIの画像生成には無料枠がなく、生成枚数に応じた従量課金です（2026年9月時点）。Flash2（Nano Banana 2、gemini-3.1-flash-image）は1K解像度で1枚あたり0.1米ドル未満と、Proモデルよりコストを抑えられます。月100〜200枚程度の生成であれば、月あたり数千円程度に収まることが多い水準です。解像度を上げるほど単価も上がるため、最新の料金はGoogle AI Studioの料金ページで確認してください。
Q. WordPressへの自動アップロードはどうやって行いますか？
SSH経由でWP-CLIを使用します。詳細は「Claude Code × WordPressで記事公開を完全自動化」の記事で解説しています。サムネイルのアップロードだけでなく、記事本文・カテゴリ・SEOメタ情報の設定まで一括で行えます。
まとめ
この記事では、Claude Code × Gemini APIを使ったサムネイル自動生成の仕組みと実装手順を解説しました。
- Claude CodeはGemini APIと連携することで画像生成が可能になる
- Flash2モデルは日本語テキスト描画が安定しており、メディア運用に適している
- プロンプトテンプレートとカラーパレット管理でブランドを統一しながら量産できる
- SKILL.mdでワークフロー化することで「タイトルを渡すだけ」でサムネイル生成が完結する
- Keychain認証やテキスト描画のトラブルは、適切な対処法で解決できる
SEO記事の量産において、サムネイル制作は地味に時間のかかる工程です。一度仕組みを作っておけば、以後は毎回の工数がほぼゼロになります。まずはGoogle AI StudioでAPIキーを取得し、1枚サムネイルを試し生成してみることをお勧めします。
法人向けAI導入・活用の月額伴走サービス
AI導入の疑問を、週1回のMTGで相談できる「AI顧問」
株式会社Nexaでは、ChatGPT・Claude・Claude CodeなどのAI導入に関する質問や、社内活用・業務自動化の進め方を週1回相談できる 月額7万円（毎月3社限定で月額5万円）のAI顧問サービス を提供しています。
「自社では何から始めるべきか」「この業務はAI化できるか」「どのツールを選ぶべきか」を、無料相談で整理します。
この記事で参照した外部情報
- Gemini APIの公式モデル一覧ai.google.dev
- Gemini API利用規約ai.google.dev
- Google AI Studioの料金ページai.google.dev
本文中でリンクしている外部ページの一覧です（自動生成）。最終確認日は本記事の最終更新日 2026-10-01 で、リンク先の内容はその後変わることがあります。
AI導入を検討中の方へ
