Open Graph & Twitter Card Tag Generator
Build the exact og: and twitter: meta tags that control how your page looks when it’s shared on Facebook, LinkedIn, X, Slack and messaging apps — with live link-preview mockups and a checklist that flags the mistakes that break previews.
1. Describe the page
Fill in what you want people to see when the link is shared. Everything runs in your browser — nothing is sent anywhere.
🏷️ Your meta tags
<head> of this page only — each page needs its own title, description, URL and image.Live link previews
Approximate mockups of how each network typically renders the card. Real platforms crop and truncate slightly differently, and they cache old previews — always test the live URL after publishing.
Checklist
The four required og: tags
The Open Graph protocol requires og:title, og:type, og:image and og:url. Add og:description and og:site_name so the card is not bare.
Image size
Meta recommends 1200 × 630 px (about 1.91:1) for sharp results on high-resolution screens. Images under 600 × 315 px still show, but small.
name vs property
og: tags use property="..."; twitter: tags use name="...". Mixing them up is a common reason a tag is silently ignored.
Absolute URLs only
Both og:url and og:image must be full URLs including https://. A relative path like /img/share.jpg will not resolve for a scraper.
Cached previews
Networks cache the first preview they fetch. After you fix a tag, re-scrape the URL in the platform’s debugger (for example LinkedIn’s Post Inspector) or the old card keeps showing.
Blocked by robots or login
Share scrapers need to fetch both the page and the image. A login wall, a blocked image path, or a slow server leaves you with a blank or wrong preview.
<title> and meta description for search.