OGP画像生成
タイトル・説明・サイト名・画像URLから、1280x630のOGP画像をリアルタイムで作成できます。SNSごとの表示確認とPNGダウンロードに対応。
最終更新:
使い方
使い方を開く使い方を閉じる
- 1
内容を入力
タイトル、説明、サイト名、画像URLを入力します。画像URLは未入力でも生成できます。
- 2
プレビューを確認
OGP画像のプレビューと、X・Facebook・LINE・LinkedInの表示イメージを確認します。
- 3
PNGで保存
「PNGダウンロード」をクリックして、生成したOGP画像を保存します。
プレビューを更新しました: タイトルを入力してください
入力設定
画像URLが読み込めない場合は、背景グラデーションのみで生成されます。
生成プレビュー
出力サイズ: 1280 x 630 px
SNS表示確認
X (Twitter)
タイトルを入力してください
説明文を入力すると、ここにプレビュー用テキストが表示されます。
Your Site
タイトルを入力してください
説明文を入力すると、ここにプレビュー用テキストが表示されます。
Your Site
LINE
タイトルを入力してください
説明文を入力すると、ここにプレビュー用テキストが表示されます。
Your Site
タイトルを入力してください
説明文を入力すると、ここにプレビュー用テキストが表示されます。
Your Site
OGP画像生成ツールとは
OGP画像生成ツールは、SNSシェア用の画像をブラウザ上で作成できるツールです。OGP（Open Graph Protocol）画像は、WebページをX（旧Twitter）やFacebook、LINEなどでシェアした際に表示されるサムネイル画像を定義するものです。適切なOGP画像がないページは、SNSでシェアされたときに視覚的なインパクトが弱く、クリック率の低下につながります。タイトルや説明を変更するとリアルタイムで画像を再生成し、すぐにダウンロードできます。デザインツールを使わなくても、テキストを入力するだけで一定クオリティのOGP画像を短時間で用意できるため、コンテンツ担当者や個人ブロガーが記事公開前に素早く対応するのに適しています。X、Facebook、LINE、LinkedInそれぞれの表示イメージをツール内で確認できるので、公開後のギャップを事前に減らせます。
主な機能
- 1280x630のOGP画像をリアルタイム生成
- タイトル・説明・サイト名・画像URLの入力に対応
- X / Facebook / LINE / LinkedInの表示イメージ確認
- 生成結果をPNG形式でそのままダウンロード
- 画像URLが使えない場合もグラデーション背景で生成
こんな場面で役立ちます
- ブログ記事公開前にOGP画像をすばやく準備したいとき
- キャンペーンページ用のSNS告知画像を作るとき
- 複数SNSでの見え方を事前に確認したいとき
- デザインチームに渡すたたき台画像を短時間で作るとき
- プレスリリースやランディングページのOGP画像をデザイナーに依頼する前に内容を検討したいとき
- OGPメタタグを実装したページの表示が意図通りかを素早く試したいとき
よくある質問
なぜ1280x630で生成するのですか？
多くのSNSで推奨される横長比率に近く、主要プラットフォームで共通利用しやすいためです。
画像URLを指定しても反映されないことがあります
外部画像のCORS設定により、ブラウザから読み込めない場合があります。その場合は背景画像なしで生成されます。
入力データはサーバーに送信されますか？
いいえ。生成処理とプレビューはすべてブラウザ内で完結し、入力内容はサーバーに送信されません。
スマートフォンでも使えますか？
はい。レスポンシブ対応のため、PC・タブレット・スマートフォンで利用できます。
生成した画像をHTMLのOGPタグに設定するにはどうすればよいですか？
ダウンロードしたPNG画像を自分のサーバーやCDNにアップロードし、そのURLをHTMLの <meta property="og:image" content="画像URL"> タグに設定します。あわせて og:image:width に 1280、og:image:height に 630 を指定しておくとSNSクローラーの解釈が安定します。
SNSで表示されるテキストはOGP画像のテキストと別に設定が必要ですか？
はい。OGP画像はあくまでサムネイル用の画像ファイルです。SNSシェア時に表示されるタイトルや説明文は、HTMLの og:title や og:description メタタグで別途設定する必要があります。このツールで作成した画像と同じ内容をメタタグにも記述することで、一貫した見た目になります。