無料Open Graph画像ジェネレーター

数回クリックするだけで、素晴らしいOG画像、Twitter/Xヘッダーなどを簡単に作成 - デザインスキル不要。PNG（推奨）、JPEG、またはWebP形式を使用して、Twitter、Facebook、LinkedInなどのソーシャルメディアプラットフォームで最適な表示を確保。自動化が必要ですか？強力なAPIでOpen Graph画像を即時生成。

Choose a template

テンプレートプロパティ
プロパティを変更して画像をカスタマイズ。
背景
画像のカスタム背景を設定。
グラデーション方向
グリッドオーバーレイ
0.15
Preview
Open Graphに最適な画像形式
ソーシャルメディア共有に最適な画像形式を選択。
  • PNG: テキストとロゴに優れた品質を提供。
  • JPEG: 複雑な色を持つ写真や画像に最適。
  • WebP: 高品質を維持しながら優れた圧縮を提供する最新の形式。
画像をダウンロード
PNG、JPEG、またはWebP形式で画像をエクスポート。

Twitter、Facebook、LinkedInなどのプラットフォームでOpen Graph（OG）画像を最適に表示するには、PNG（推奨）、JPEG、またはWebP形式を使用することをお勧めします。

API統合
APIを使用してOpen Graph画像を即時生成。

リクエストボディをJSONまたはcURLコマンドとしてコピー。

Open Graph画像の追加が簡単に

わずか数分でウェブサイトにソーシャルメディアプレビュー画像を簡単に追加。HTMLまたはNext.js App Routerを使用するかどうか、以下から希望の方法を選択してください。

1. 画像を保存

生成したOG画像をog.pngとしてウェブサイトのルートディレクトリに保存。

2.生成 Open GraphタグをHTML headに追加

<!-- Basic OG Tags -->
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="Your page description" />
<meta property="og:image" content="https://yourdomain.com/og.png" />
<meta property="og:url" content="https://yourdomain.com" />

<!-- Twitter/X Card Tags -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://yourdomain.com/og.png" />

<!-- Optional but recommended -->
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Your Site Name" />

yourdomain.comを実際のドメイン名に置き換えてください。

エキスパートのヒント

  • OG画像が読み込まれない場合に備えて、バックアップ画像を常に用意。
  • ソーシャルメディアデバッグツールを使用してOG画像をテスト。
  • アクセシビリティを向上させるために意味のあるaltテキストを追加。
  • 頻繁に更新されるコンテンツには動的OG画像を選択。