Open Graph Preview
Free Open Graph preview and meta tag generator. See how your link looks when shared on Facebook, X and LinkedIn, and copy ready-to-paste og: and twitter: meta tags.
🔒 Everything runs in your browser — nothing you type or paste is uploaded. Previews are visual approximations; Facebook, X and LinkedIn may render slightly differently.
Free Open Graph Preview & Meta Tag Generator
This free Open Graph preview tool shows you exactly how your link will look when it’s
shared on Facebook, Twitter/X and LinkedIn — before you
hit publish. Type your title, description, image URL and site address and watch the social cards build live, then
copy the ready-made Open Graph and Twitter Card meta tags straight into your page’s
<head>. It’s free, instant and runs entirely in your browser.
How to use the Open Graph preview tool
- Enter your title, description, image URL and site URL on the left (or click Load sample).
- Watch the Facebook, X and LinkedIn cards update live on the right.
- If the image is missing or fails to load, a placeholder is shown so you can spot the problem.
- Check that the title and description are not cut off, and that your image fills the card.
- Click Copy meta tags to grab the full set of
og:andtwitter:tags.
What are Open Graph tags?
Open Graph is a small protocol (the og: properties) that Facebook introduced and that almost every
social platform now reads. When someone pastes your link, the platform looks in your page’s
<head> for tags like og:title, og:description, og:image
and og:url to build the rich preview card. Without them, the platform guesses — often picking a
random image or no description at all, which looks unprofessional and gets fewer clicks.
Good social previews matter because the card is the first thing people see; a clear title and an eye-catching
image dramatically improve click-through rate. For the image, the recommended size is 1200×630
pixels (a 1.91:1 ratio), which fills the large card on every network without being cropped. Twitter/X also
reads its own twitter: tags; setting twitter:card to
summary_large_image tells X to show the big visual card instead of a small thumbnail. This tool
generates both the Open Graph and the Twitter Card tags for you.
Frequently asked questions
Is this Open Graph preview tool free and private?
What size should my Open Graph image be?
What is the difference between Open Graph and Twitter Card tags?
og: prefix and are read by Facebook, LinkedIn and most
platforms. Twitter/X reads its own twitter: tags. Setting twitter:card to
summary_large_image shows the big visual card. This tool outputs both sets so your link looks right everywhere.Why does my real share preview look different or out of date?
Where do I put the meta tags I copy?
<head> section of your page’s HTML. On
WordPress, an SEO plugin such as RankMath or Yoast usually has fields for the social title, description and image
that map to these same Open Graph tags.