cover-image

カバー画像ジェネレーター

豊富なスタイルや構図のオプションを使って、手描き風のカバー画像を生成します。

使用方法

# From markdown file (auto-select style based on content)
/cover-image path/to/article.md

# Specify a style
/cover-image path/to/article.md --style tech
/cover-image path/to/article.md --style gradient

# Specify a composition
/cover-image path/to/article.md --composition hero-center

# Without title text
/cover-image path/to/article.md --no-title

# Combine options
/cover-image path/to/article.md --style editorial --composition split --no-title

# From direct text input
/cover-image
[paste content or describe the topic]

オプション

オプション	説明
--style <name>	カバーのスタイルを指定します（下記のスタイル一覧を参照）
--composition <name>	レイアウト構成を指定します（下記の構図一覧を参照）
--no-title	タイトル文字なしでカバーを生成します（ビジュアルのみ）

スタイル一覧

基本スタイル

スタイル	説明	最適な用途
elegant（デフォルト）	洗練され、上品で控えめ	ビジネス、オピニオンリーダーシップ、プロフェッショナル向け
tech	モダンでクリーン、光彩効果のある近未来的なスタイル	AI、コーディング、デジタル、アルゴリズム
warm	親しみやすく、人間中心の温かみのあるスタイル	自己成長、ライフスタイル、教育
bold	コントラストが高く、目を引くエネルギッシュなスタイル	オピニオン記事、議論を呼ぶ話題、緊急性の高い内容
minimal	非常にクリーンで禅のような、余白を最大限に活かしたスタイル	哲学、集中、本質主義
playful	楽しく創造的で、遊び心のある落書き風	チュートリアル、初心者向けガイド、カジュアルな内容
nature	自然で穏やかな、アースカラーのスタイル	サステナビリティ、ウェルネス、アウトドア
retro	ヴィンテージでノスタルジック、使い込まれた質感	歴史、回顧、古典的な話題

拡張スタイル

スタイル	説明	最適な用途
gradient	滑らかな色の変化、夢のようでモダンなスタイル	製品発表、告知、ブランディング
editorial	雑誌品質の洗練されたタイポグラフィ	長編エッセイ、深掘り記事、ジャーナリズム
blueprint	方眼紙を使った技術図面の美学	建築、システム設計、エンジニアリング
watercolor	柔らかな色のにじみ、自然な広がり、絵画的なスタイル	アート、文化、創作、詩
geometric	鋭い形状、テッセレーション、数学的なスタイル	データサイエンス、数学、体系的な思考
neon	鮮やかに光る要素を配した暗い背景	ナイトライフ、ゲーム、サイバーパンク、スタートアップ
paper-cut	紙を重ねて切り抜いたような奥行き効果	ストーリーテリング、子ども向けコンテンツ、クラフト
ink-wash	東アジアの筆墨の美学（水墨風）	中国文化、哲学、書道

スタイルの詳細な定義：references/styles/<style>.md

構図一覧

構図は、カバー画像内で要素をどのように配置するかを定義します。

構図	説明	使用する場面
hero-center（デフォルト）	ひとつの主役となるビジュアルを中央に配置し、タイトルを上または下に置く	汎用、ひとつの強いコンセプト
split	左右または上下に分割し、片側にビジュアル、もう片側にテキストを配置	比較、ビフォーアフター、対になるコンセプト
floating	奥行きを持たせた要素を空間に浮かぶように散りばめる	抽象的な話題、複数の関連コンセプト
frame	装飾的な枠で中央のコンテンツを囲む	フォーマルな内容、告知、証明書風
diagonal	斜めの分割や流れで動きを表現する	動き、進展、変化
spotlight	暗い背景に、ひとつの被写体を明るく照らして配置	集中、強調、重要な洞察
panoramic	横幅いっぱいに広がるワイドなシーン	風景、旅、タイムライン
mosaic	小さな関連ビジュアルを格子状に並べて、より大きな絵を作る	コレクション、多様性、エコシステム
vignette	端から中央の焦点に向かって柔らかくフェードさせる	親密な内容、個人的な内容、回顧録風
layered	面を重ねて奥行きを作る	複雑な話題、多層的なアイデア

構図のヒント

• hero-center ＋ タイトル：ビジュアルを少し左に置き、タイトルを右に配置します
• hero-center ＋ タイトルなし：ビジュアルを中央に配置し、余白を活かします
• split：左右に対照的な色やコンセプトを使います
• floating：要素は最大3〜5個にし、サイズに変化をつけて奥行きを出します
• diagonal：方向で進展を表現します（左下 → 右上 ＝ 成長）
• spotlight：背景を非常に暗くし、被写体を鮮やかにします
• mosaic：タイルを4〜9個使い、全体でスタイルを統一します
• layered：不透明度やぼかしを使い、前景と背景を分けます

スタイルの自動選択

--style が指定されていない場合、コンテンツを分析して最適なスタイルを選択します。

コンテンツのシグナル	選択されるスタイル
AI、コーディング、テクノロジー、デジタル、アルゴリズム、API	tech
個人的な体験、感情、成長、人生、旅	warm
議論を呼ぶ、緊急、必読、警告、速報	bold
シンプル、禅、集中、本質、少ないほど豊か	minimal
楽しい、簡単、初心者向け、カジュアル、チュートリアル、ステップ・バイ・ステップ	playful
自然、エコ、ウェルネス、健康、オーガニック、アウトドア	nature
歴史、古典、ヴィンテージ、昔、伝統	retro
製品、ローンチ、リリース、発表、ブランド	gradient
エッセイ、分析、深掘り、調査、レビュー	editorial
システム設計、アーキテクチャ、設計図、インフラストラクチャ	blueprint
アート、絵画、創作、詩、文化	watercolor
データ、数学、統計、幾何学、パターン	geometric
ゲーム、スタートアップ、ナイトライフ、暗号資産、ハッカー	neon
物語、民話、イラスト、工芸、子ども	paper-cut
中国、文化、哲学、書道、中国風、伝統	ink-wash
ビジネス、プロフェッショナル、戦略、分析（デフォルト）	elegant

構成の自動選択

--composition が指定されていない場合：

条件	選択される構成
ひとつの強い概念や比喩	hero-center
記事で2つのものを比較している	split
記事で複数のツールやアイデアを扱っている	floating または mosaic
個人的で親密なテーマ	vignette
旅、タイムライン、進捗を描くストーリー	diagonal または panoramic
ひとつの重要な洞察や発見	spotlight
複雑で多層的なテーマ	layered
フォーマルなトーン、または発表	frame

ファイル管理

記事のパスがある場合

記事と同じフォルダー内の imgs/ サブディレクトリに保存します。

path/to/
├── article.md
└── imgs/
    ├── prompts/
    │   └── cover.md
    └── cover.png

記事のパスがない場合

現在の作業ディレクトリに保存します。

./
├── cover-prompt.md
└── cover.png

ワークフロー

ステップ 1：コンテンツを分析する

重要な情報を抽出します。

• 主なトピック：記事のテーマは何ですか？
• 中心的なメッセージ：最も重要な要点は何ですか？
• トーン：真面目、遊び心のある、感動的、教育的のどれですか？
• キーワード：スタイルを示す言葉を特定します
• 構成：比較ですか？旅ですか？深掘りですか？
• ビジュアルの比喩：テーマを表す現実世界の物や情景は何ですか？

ステップ 2：スタイルと構成を選択する

--style または --composition が指定されている場合は、それらを使用します。指定されていない場合：

1. コンテンツからスタイルと構成を示すシグナルを探します
2. シグナルに最も適したスタイルと構成を選びます
3. 明確なシグナルがない場合は、デフォルトの elegant スタイルと hero-center 構成を使用します

ステップ 3：カバーのコンセプトを作成する

タイトル（含める場合は最大 8 文字）：

• 中心的なメッセージを、印象的な見出しにまとめます
• 数字、問いかけ、対比、悩みの種などを使って興味を引きます
• --no-title フラグが使われている場合は省略します

ビジュアル要素：

• スタイルに合った画像やアイコン
• テーマを表す象徴的な要素を 1～2 個
• スタイルに合った比喩やアナロジー

構成レイアウト：

• 選択した構成テンプレートを適用します
• 構成内でのタイトルの配置を検討します
• 視覚的な階層を明確にします：主要要素 ＞ 二次要素 ＞ 装飾

ステップ 4：プロンプトファイルを作成する

プロンプト形式：

Cover theme: [topic in 2-3 words]
Style: [selected style name]
Composition: [selected composition name]

[If title included:]
Title text: [8 characters or less, in content language]
Subtitle: [optional, in content language]

Visual composition:
- Main visual: [description matching style]
- Layout: [composition-specific layout description]
- Primary element: [what draws the eye first]
- Secondary elements: [supporting visuals]
- Decorative elements: [style-appropriate accents]

Color scheme:
- Primary: [style primary color]
- Background: [style background color]
- Accent: [style accent color]

Style notes: [specific style characteristics to emphasize]
Composition notes: [specific layout guidance]

[If no title:]
Note: No title text, pure visual illustration only.

ステップ 5：画像を生成する

画像生成スキルの選択：

1. 利用可能な画像生成スキルを確認します
2. 複数のスキルが利用可能な場合は、ユーザーに選択してもらいます

生成： 選択した画像生成スキルを、プロンプトファイルと出力パスを指定して呼び出します。

ステップ 6：概要を出力する

Cover Image Generated!

Topic: [topic]
Style: [style name]
Composition: [composition name]
Title: [cover title] (or "No title - visual only")
Location: [output path]

Preview the image to verify it matches your expectations.

注意事項

• カバーは、小さなプレビューサイズでもひと目で理解できるようにします
• タイトルを含める場合は、読みやすく、印象的なものにします
• 視覚的な比喩は、文字どおりの表現よりも効果的です
• カバー全体でスタイルの一貫性を保ちます
• 画像の生成には通常 10～30 秒かかります
• タイトルの言語はコンテンツの言語と一致させます
• 迷った場合は、elegant と hero-center の組み合わせが無難なデフォルトです
• 予想外のスタイルと構成の組み合わせで、独自性を生み出せます（例：ink-wash と split）