OG Image Maker

URLパラメータだけで、
OGP画像を自動生成。

タイトルや背景タイプをURLに渡すだけで 1200×630 の OGP画像を自動生成できる無料ツール。

今すぐ使う

Features

このツールの特徴

URL を貼るだけで使える

編集画面でコピーした URL をそのまま og:image に指定するだけ。画像をダウンロードしてサイトにアップする必要はありません。

豊富な背景バリエーション

パターン / ジオメトリ / グラデーションの 3 カテゴリ、合計 26 種類の背景バリエーションを用意。サイトの雰囲気に合うものを選べます。

サイトに合わせて色を調整

ライト / ダークの切り替えに加えて、キーカラーの色相・鮮やかさ・明るさを調整可能。ブランドカラーに合わせた仕上がりにできます。

2 回目以降は高速で表示

1 度生成した画像は一定期間自動でキャッシュされ、次回以降はすぐに表示されます。アクセスのたびに待たされる心配はありません。

Free

無料で利用できます

ログイン不要ですぐに使い始められます。

Gallery

背景バリエーション

色やレイアウトを切り替えて、各バリアントの見え方を確認できます。

2-1 · Lit Slope2-1

2-2 · Diagonal Accent2-2

2-3 · Extruded Circle2-3

2-4 · Editorial Circles2-4

2-5 · Layered Waves2-5

2-6 · Code Panel2-6

2-7 · Corner Grid2-7

2-8 · Accent Dot Grid2-8

2-9 · Circuit Trace2-9

2-10 · Data Bars2-10

2-11 · Concentric Ripple2-11

ここに表示しているのはバリエーションの一部です。

How to use

3 ステップで使える

Step 1

編集画面で背景の種類を選ぶ

編集画面で Pattern / Geometry / Gradient のカード一覧から、サイトの雰囲気に近い 1 枚をクリックして選択します。

Step 2

設定パネルで見た目を詰める

設定パネルでテキストの配置やカラー、背景効果などを切り替えると、選択中のカードに即時反映されます。ダミーコンテンツ付きのプレビュー表示で仕上がりを確認します。

Step 3

URL をコピーして og:image に貼る

設定パネル下部ある「URLをコピー」ボタンで、API URL をコピーします。YOUR_TITLE_HERE/HEAD_META/FOOT_METAを実テキストに置き換えて、記事ページのog:imageに指定してください。
もしくは、背景画像だけをダウンロードすることもできます。自身のプロダクトでsatoriなどを使っている場合に、その背景としてダウンロードした画像を利用していただくことも可能です。

いますぐ試す

URLパラメータだけで、OGP画像を自動生成。