*OGImageTool*無料のOG画像ジェネレーター
登録不要、簡単なクリックで美しいOG画像やTwitter/Xヘッダー画像を無料で作成。
100%無料
サインアップ不要
ローカル処理・プライバシー重視
透かしなし
プレビューギャラリー
作成できるデザインをチェック
左右にスワイプしてもっと見る
左右にスワイプしてもっと見る
今すぐ試してみましょう
Preparing editor...
なぜ OGImageTool を選ぶのか？
魅力的なSNS画像を数秒で作るための機能をすべて搭載
無料・登録不要
登録やクレジットカード不要。主要機能を無料で利用できます。
マルチプラットフォーム対応
主要SNSサイズに最適化。Open Graph や Twitter/X ヘッダーに対応。
プロ向けテンプレート
Basic / Hero / Image Right / Notice / Logos など豊富なテンプレート。
柔軟な書き出し
PNG・JPEG・WebP で高品質にエクスポート可能。
高度なカスタマイズ
背景、グラデーション、ブランドカラー、ロゴ画像を自由に調整。
モダンデザイン
洗練されたタイポとビジュアル効果で完成度を高めます。
リアルタイムプレビュー
変更を即時確認できるため、制作スピードが上がります。
高速生成
数秒でSNS向け画像を作成できる直感的なワークフロー。
Open Graph 画像の追加方法
数分でサイトにSNSプレビュー画像を追加できます。HTML と Next.js App Router から選択可能。
1. 画像を保存
生成した OG 画像を og.png としてサイトのルートに保存します。
2. 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 を実際のドメインに置き換えてください。
プロ向けTips
- OG画像が読み込めない場合に備えてフォールバック画像を用意する
- 公開前にSNSデバッガーで表示確認を行う
- アクセシビリティ向上のため適切な alt テキストを設定する
- 更新頻度の高いページでは動的OG画像を検討する