Control how your links look when they are shared
When someone pastes your link into Facebook, LinkedIn, X, WhatsApp or Slack, the app reads Open Graph tags from your page to build the preview card: the image, the headline, the short description and the site name. The Open Graph Generator writes those og: tags, plus the Twitter Card tags X still uses, as clean, escaped HTML ready for your page’s <head>.
Five side-by-side preview styles show roughly how the card will look on each network, and the image checker tells you whether your picture has the right size and shape. It’s free, needs no account, and everything happens in your browser — the tool never visits your site. The only network request is the one your own browser makes if you press “Check image size” to load your image.
How to use the Open Graph Generator
- Enter the title, description, page URL and site name. Choose a type — “article” adds publish time, author and section fields.
- Paste the full image URL and press Check image size to load it and fill in the width and height automatically. Or use Preview a local image to try a picture before you upload it.
- Describe the image in og:image:alt and pick the X card type and accounts.
- Switch between the Facebook, X, LinkedIn, WhatsApp and Slack previews and fix anything that looks cut off.
- Read the checks, then Copy HTML and paste the tags inside the
<head>of that page.
Open Graph Generator features
Five preview styles
Approximations of Facebook, X (large and summary cards), LinkedIn, WhatsApp and Slack link cards, updated as you type.
Real image check
Loads your og:image in the browser, reads its true pixel size and ratio, and fills in og:image:width and height for faster first shares.
Size and ratio rules built in
Warns about images under 600 px wide, X’s 300 × 157 minimum, square images in large cards and files over X’s 5 MB or Facebook’s 8 MB limit.
Article metadata
Adds article:published_time in ISO 8601 with your time-zone offset, plus article:author and article:section.
No duplicate clutter
X falls back to og:title, og:description and og:image, so twitter: copies are optional — tick one box if you want different text on X.
The best Open Graph image size
Use 1200 × 630 pixels (a 1.91:1 ratio) as your default share image. It displays sharply as a large card on Facebook and LinkedIn, and X crops it only slightly to its 2:1 large-card shape. Keep text and faces away from the edges, because every network crops a little differently, and many show the image smaller on phones.
Formats: JPG for photos, PNG for graphics with text, or WebP where supported. SVG does not work. Keep the file reasonably small — a compressed JPG of a few hundred kilobytes loads quickly in chat apps, which may skip heavy images. The Image Resizer and Social Media Image Sizes guide help you prepare it.
| Network | Recommended | Notes |
|---|---|---|
| 1200 × 630 | At least 600 px wide for a large preview; up to 8 MB | |
| X large card | 1200 × 628 or 1200 × 600 (2:1) | Minimum 300 × 157; under 5 MB |
| X summary card | 1:1, e.g. 600 × 600 | Minimum 144 × 144 |
| About 1200 × 627 | Uses og: tags; cached for days | |
| WhatsApp, Slack | 1200 × 630 | Read og: tags; may show a small thumbnail |
Required and optional Open Graph tags
The Open Graph protocol lists four required properties: og:title, og:type, og:image and og:url. In practice you should also set og:description and og:site_name. Use the canonical address of the page for og:url, so likes and shares are counted against one URL. For the classic SEO tags that sit alongside these, use the Meta Tag Generator.
Open Graph tags use the property attribute, while Twitter Card tags use name. Mixing them up is one of the most common reasons a card does not appear.
When your preview doesn’t update
- Caching: networks store a copy of your preview. Use Facebook’s Sharing Debugger or LinkedIn’s Post Inspector to fetch the page again after changing tags.
- X: the old Card Validator no longer shows previews; compose a post (without sending it) to see the current card. X’s layout changes often — large cards currently show the image with the domain overlaid.
- Blocked crawlers: if robots.txt, a login wall or a firewall blocks facebookexternalhit, LinkedInBot or Twitterbot, they cannot read your tags.
- Tags added by JavaScript: most preview crawlers do not run scripts, so put the tags in the HTML your server sends.
Open Graph Generator FAQ
What is an Open Graph generator?
It is a tool that writes the og: meta tags social networks read to build link previews. This Open Graph generator also writes Twitter Card tags, checks your image and shows approximate previews.
What size should an og:image be?
1200 × 630 pixels is the safest choice for large previews everywhere. The minimum for a large Facebook preview is 600 px wide, and X needs at least 300 × 157 for a large card or 144 × 144 for a summary card.
Do I still need Twitter Card tags if I have Open Graph tags?
You need twitter:card to choose the card type. For the title, description and image, X falls back to the matching og: tags, so separate twitter:title, twitter:description and twitter:image tags are only needed if you want different content on X.
Why does Facebook show an old image or title?
Facebook caches link previews. After updating your tags, open the Sharing Debugger, paste the URL and choose to scrape again. LinkedIn’s Post Inspector does the same for LinkedIn.
Do Open Graph tags help SEO?
Not directly — Google does not use og: tags as a ranking factor. They make shared links more attractive and clickable, which can bring more visitors.
Are the previews exact?
No. They are careful approximations based on each network’s typical layout. Fonts, crops and layouts differ between apps and change over time, so always confirm with the network’s own debugging tool.