OGP/SNSカードプレビュー

OGPメタタグの内容から、X・Discord・LINEでのカードの見え方をブラウザ内で再現します。入力内容は送信されません（CORS制限のため外部URLの自動取得は行いません）。

方法1: ページのHTMLソースを貼り付け（<head>の一部だけでもOK。og:title 等を読み取って下の入力欄に反映します）

方法2: 手動入力 — タイトル（og:title）

説明（og:description）

画像URL（og:image）

画像ファイル（プレビュー用・ローカル選択。URLより優先）

サイト名（og:site_name）

Xのカード種別（twitter:card）

0タイトル文字数（推奨60字以内）

0説明文字数（推奨90〜120字）

カードプレビュー

切れ位置は目安です（X: タイトル約70字・説明約200字。端末やアプリで変わります）。

OGPメタタグの生成

上の入力値から <meta> タグ一式を生成します。<head> 内に貼り付けてください。

OGP（Open Graph Protocol）とは

OGPは、SNSやチャットアプリにURLを貼ったときに表示されるカード（タイトル・説明・画像）の内容を指定するためのメタタグの仕様です。 og:title / og:description / og:image / og:site_name をHTMLの<head>内に記述します。 Xでは加えて twitter:card でカードの種類（summary_large_image / summary）を指定します。

画像の推奨サイズ

推奨は1200×630px（アスペクト比約1.91:1）です。X の summary_large_image、Discord、LINE、Facebookなど主要サービスで綺麗に表示されます
X の summary（小さいカード）では正方形にトリミングされるため、中央に主要な要素を置くと安全です
ファイルサイズは数百KB以内に抑えると読み込みが安定します

タイトル・説明の推奨長

タイトルは60字以内が目安です。Xではおおよそ70字で「…」と省略されます
説明は90〜120字が目安です。サービスによっては説明が表示されない（Xの新しいカードなど）場合もあるため、タイトルだけで内容が伝わるようにしましょう

注意

本ツールのカードはCSSによる再現で、実際の表示は各サービスのバージョン・端末・フォントにより変わります。また、ブラウザのCORS制限のため外部URLからのHTML自動取得はできません。ページのソース（Ctrl+U等で表示）をコピーして貼り付けてください。