OG画像ジェネレーター
SNSシェア時のクリック率を高めるOGP画像をブラウザ上で作成・ダウンロード。
1200×630px対応、豊富なテンプレートと日本語フォント完備。
📚 テンプレート
💾 出力・ダウンロード
🏷️ OGPメタタグ生成
OG画像ジェネレーターの仕組み・概要
OG画像（Open Graph画像）は、WebページがSNS（X/Twitter、Facebook、LINEなど）でシェアされた際に表示されるプレビュー画像です。魅力的なOG画像はクリック率（CTR）を大幅に向上させる重要な要素です。
本ツールは、高画質対応のプロ品質OG画像をブラウザ上で完全無料・登録不要で作成できます。豊富なテンプレート、自由なグラデーション背景ジェネレーター、フォント設定機能などを備えています。
生成・エクスポート処理を含めすべてお使いのブラウザ内（ローカル環境）で完結するため、安全に画像を作成できます。
ツールの使い方
テンプレートの選択
テック、ブログ、マーケティングなどのカテゴリからベースとなるデザインを選びます。1からカスタマイズすることも可能です。
デザインのカスタマイズ
タイトルテキスト、背景のグラデーションや色、ロゴ画像、装飾用バッジなどを調整し、SNSプレビューで確認します。
保存・メタタグ設定
PNGまたはWebP形式で画像をダウンロード。ツール下部でHTMLのOGPメタタグを生成してサイトに設定します。
OGP・画像の用語集
- OGP (Open Graph Protocol)
- Facebookが提唱した、WebページがSNSでシェアされた際のタイトル、画像、説明文の表示情報を定義するメタデータ規格です。適切に設定することで、シェア時の視認性が大きく向上します。
- Twitter Card (summary_large_image)
- X(Twitter)独自のメタタグで、`summary_large_image` を指定することで、タイムライン上で大きな画像付きのカードとして表示され、ユーザーの目を引きやすくなります。
- アスペクト比 1.91:1
- 横と縦の比が1.91対1の横長の比率。Meta（Facebook）の開発者向け文書は、フィードで画像全体をトリミングなしに表示するには、アスペクト比をできるだけ1.91:1に近づけるよう案内しています。1200×630pxは約1.91:1です。
- デバイスピクセル比 (DPR)
- CSSの1ピクセルを物理的なピクセルいくつで描画するかを示す値。本ツールはRetina等の高DPRディスプレイでも文字がぼやけないよう、最適なスケールでCanvasレンダリングを行っています。
よくある質問
- Q.作成したOG画像の推奨サイズは？
- Meta（Facebook）の開発者向け文書は、高解像度の端末での表示のために1200×630ピクセル以上の画像を使うこと、フィードでトリミングなしに全体を表示するにはアスペクト比をできるだけ1.91:1に近づけることを案内しています。本ツールは1200×630px（約1.91:1）の比率で画像を作成します。X（Twitter）やLINEなど他のサービスについては、各サービスの案内をご確認ください。
- Q.作成した画像はどうやってサイトに設定しますか？
- ダウンロードした画像をサーバー（WordPressのメディアやAWS S3等）にアップロードし、そのURLをページの `<head>` 内の `<meta property="og:image" content="...">` タグに指定します。
- Q.画像やテキストのデータはサーバーに保存されますか？
- いいえ。入力されたテキストやアップロードしたロゴ画像、生成されたOG画像など、すべての処理はお使いのブラウザ内（ローカル）で完結するため、外部にデータが漏洩することはありません。
- Q.X(Twitter)のSummary Large Imageとは？
- リンクシェア時に大きな画像付きのカードで表示される形式です。twitter:card に summary_large_image を設定することで有効になります。
- Q.JPEGとPNGとWebPのどれを選べば良いですか？
- 実写の写真背景ならJPEG、イラストやテキスト中心でシャープさを保ちたいならPNG、最新の軽量フォーマットとしてWebPがおすすめです。
活用シーン
ブログ記事のアイキャッチ
記事のタイトルとカテゴリバッジを配置し、タイムラインでの注目度を高めるOG画像を数秒で作成できます。
ECサイトの商品シェア
商品名とブランドロゴを含めた画像を用意することで、SNS経由の流入やコンバージョンを促進します。
イベント・ウェビナー告知
開催日時や登壇者情報を視覚的にまとめたOG画像で、参加申し込みへの誘導を強力に後押しします。
ポートフォリオ・実績
自分の作品名やプロフィール写真、肩書きを配置したプロフェッショナルな画像で信頼感を高めます。
ご意見・ご要望を送る
フィードバックを送信
ツールをより良くするためのご意見をお聞かせください。
ツールへの入力欄ではありません
現在、フィードバックの受付を一時停止しています
サーバーが混み合っているか、スパム防止のための安全装置が作動しています。しばらく経ってから再度アクセスしてください。