OGP画像生成ツール（無料・登録不要）
登録不要 無料 ブラウザ完結
このツールの特徴: Twitter/X・Facebook・Instagram・note など6サイズのOGP画像をブラウザで無料作成。テンプレート10種＋完全カスタム（背景色/グラデーション/背景画像/フォント/文字色）。Canvas APIでリアルタイムプレビュー→PNG高解像度ダウンロード。設定はLocalStorageに自動保存。登録不要・サーバー送信なし。
サイズ:
1200 × 630 px
背景
テキスト
レイアウト
ダウンロード設定
OGP画像の作り方（4ステップ）
- サイズを選ぶ — 使用するSNS（Twitter・Facebook・Instagram等）に合わせてサイズボタンをクリック
- テンプレートを選ぶ — 10種のデザインからベースを選択。プレビューがリアルタイム更新
- テキストを入力する — 「テキスト」タブでタイトル・サブタイトル・著者・サイト名を入力
- PNGをダウンロード — 「PNGダウンロード」ボタンで高解像度画像を即ダウンロード
設定はブラウザのLocalStorageに自動保存されます。次回訪問時にも前回の設定が引き継がれます。
OGP（Open Graph Protocol）画像とは、ブログや記事をSNSでシェアしたときに表示されるサムネイル画像のことです。og:imageタグで指定します。
OGP画像が重要な3つの理由
- クリック率（CTR）向上: 視覚的に魅力的なOGP画像はシェアのクリック率を最大3倍高めると言われています
- ブランド認知: 統一されたデザインで記事ブランドを強化できます
- SNSアルゴリズム優遇: 画像付き投稿はテキストのみより多くのユーザーに届く傾向があります
OGP画像の最適サイズ（2026年版）
| SNS | 推奨サイズ | アスペクト比 | 最大ファイルサイズ |
|---|---|---|---|
| Twitter / X | 1200 × 630 px | 1.91:1 | 5MB |
| 1200 × 630 px | 1.91:1 | 8MB | |
| 1200 × 627 px | 1.91:1 | 5MB | |
| はてなブログ | 800 × 400 px | 2:1 | − |
| note | 1280 × 670 px | 1.91:1 | 10MB |
| Instagram（正方形） | 1080 × 1080 px | 1:1 | 8MB |
CTRを高めるOGP画像デザインの実践ポイントです。
1
タイトルは30文字以内
SNSのタイムラインで読み切れる文字数。大きく・太く・中央配置が基本。
2
コントラスト比4.5:1以上
明るい背景に暗い文字、または暗い背景に白文字。視認性が格段に上がる。
3
サイト名・ロゴを必ず入れる
ブランドを覚えてもらうためにドメイン名か屋号を下部に小さく入れる。
4
カテゴリバッジで内容を伝える
「初心者向け」「無料」「2026年版」などのバッジでクリックを促す。
5
全SNSで1サイズ共用は危険
InstagramはTwitterと比率が違う。SNSごとに最適なサイズで作成する。
Twitterでシェアされたときに大きな画像カードを表示するには、OGP設定に加えTwitter Card専用のmetaタグが必要です。
必須metaタグ（HTMLに追加）
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="記事タイトル" />
<meta name="twitter:description" content="記事の説明文" />
<meta name="twitter:image" content="https://example.com/ogp.png" />
<!-- OGPタグも必須 -->
<meta property="og:image" content="https://example.com/ogp.png" />
注意点:
twitter:card を summary_large_image にしないと小さい正方形で表示される。画像サイズは1200×630px以上・最大5MB・JPEG/PNG/WebP/GIF対応。
各ブログプラットフォームでのアイキャッチ画像設定方法です。
WordPress
- 記事編集画面の右サイドバー「アイキャッチ画像」をクリック
- 「アイキャッチ画像を設定」→ メディアライブラリにアップロード
- 推奨サイズ: 1200×630px（テーマによって異なる場合あり）
- OGP対応テーマ（Cocoon・SWELL等）なら自動でog:imageに設定される
はてなブログ
- 記事編集画面の「記事の設定」→「このエントリーのサムネイル」
- 800×400px推奨（はてなブログカード表示に最適）
- はてなブログProで詳細OGP設定が可能
note
- 記事右上のカバー画像エリアをクリックしてアップロード
- 推奨サイズ: 1280×670px（アスペクト比1.91:1）
- 画像は自動でog:imageとして使用される
主要なOGP画像作成ツールとの機能比較（2026年5月調査）。
| ツール | SNSサイズ対応 | テンプレート | 背景画像 | ブラウザ完結 | 登録 | 設定保存 |
|---|---|---|---|---|---|---|
| 本ツール（tool-box.jp） | ✔ 6サイズ | ✔ 10種 | ✔ | ✔ | 不要 | ✔ LocalStorage |
| rilaks.jp/eyecatch-maker | △ 1サイズのみ | ✗ | ✗ | ✔ | 不要 | ✗ |
| ogpanic.com | △ 動的のみ | △ 少 | △ | ✗ サーバー依存 | 要登録 | ✔ |
| Canva（OGPテンプレ） | ✔ 多数 | ✔ 多数 | ✔ | ✗ 外部サービス | 要登録 | ✔ 要会員 |
| ogimage.tsmallfield.com | ✗ 確認のみ | ✗ | ✗ | ✔ | 不要 | ✗ |
※ 2026年5月現在の調査。各サービスの仕様は変更される場合があります。
- Q 作成したOGP画像は無料で使えますか？
- A はい、完全無料・商用利用可能です。登録不要でダウンロードした画像の著作権はご自身に帰属します。
- Q 背景に写真を使いたいのですが対応していますか？
- A はい。「背景設定」タブで「画像」を選択し、ファイルを選ぶと背景画像として使用できます。ファイルはブラウザ内のみで処理され、サーバーには送信されません。
- Q ダウンロードした画像のファイルサイズが大きすぎます
- A 「ダウンロード品質」スライダーを下げるとファイルサイズを削減できます。TwitterはPNG最大5MB、Facebookは8MBが上限です。サイズオーバーする場合は品質を80〜90%に調整してください。
- Q フォントを変えることはできますか？
- A 「スタイル設定」タブからフォントを選択できます。現在はゴシック・明朝・丸ゴシック・等幅の4種を内蔵しています。ブラウザに依存するためOSによって表示が若干異なる場合があります。
- Q スマートフォンでも使えますか？
- A はい。iPhone Safari・Android Chromeで動作確認済みです。ただしCanvas操作はPC環境が快適です。モバイルではテンプレート選択→テキスト入力→ダウンロードの流れを推奨します。
- Q 作成した設定を保存して次回も使えますか？
- A はい。ブラウザのLocalStorageに自動保存されます。同じブラウザで次回訪問した際、前回の設定が自動で読み込まれます。プライベートブラウズでは保存されませんのでご注意ください。