Open Graph Tag Generator
Generate Open Graph and Twitter Card meta tags for social sharing
About This Tool
Produces Open Graph (og:title, og:description, og:image, og:url, og:type) and Twitter Card (twitter:card, twitter:title, twitter:image) meta tags from a single set of inputs. Output is HTML ready to paste into the document head.
Recommended image dimensions are 1200×630 for Open Graph and 1200×675 for large Twitter cards. The tags drive link previews on Facebook, LinkedIn, Slack, Discord, and X. Optional fields include locale and article-specific metadata.
The Open Graph protocol was introduced by Facebook in 2010 to give pages structured metadata for social sharing. The protocol uses RDFa-style meta tags with og: prefixed properties. Adoption spread to LinkedIn, Slack, Discord, iMessage, and most other platforms that render link previews. Twitter introduced its own twitter: prefixed tags but accepts og: tags as fallback, so most sites set Open Graph tags primarily and add twitter: tags only where they need to differ.
Tag interactions follow precedence rules. og:title is the title of the shared object; falls back to the document title element if absent. og:description is the summary; falls back to the first paragraph or meta description. og:image is the preview image; required for image-bearing previews on every major platform. og:url is the canonical URL; falls back to the current page URL but should be set explicitly to avoid query-string variants generating duplicate previews.
A worked example for an article page: og:title="How CSP Headers Block XSS", og:description="A practical guide to Content Security Policy, with examples of nonce-based deployment.", og:image="https://example.com/posts/csp-cover.png", og:url="https://example.com/blog/csp-headers", og:type="article", og:locale="en_US". Twitter-specific overrides: twitter:card="summary_large_image" to use the larger preview format, twitter:site="@example" to attribute the source. The result renders as a 1200×630 image with overlaid title and description on Facebook, LinkedIn, and X.
Image specifications matter more than they appear. Facebook downgrades images smaller than 600×315 to small thumbnails. LinkedIn displays them in a 1.91:1 frame, cropping vertical images aggressively. X uses 16:9 (1200×675) for summary_large_image and 1:1 (144×144) for summary. Discord respects the source aspect ratio more flexibly than the others. The 1200×630 baseline survives all of them with minimal cropping; deviating from it produces inconsistent previews across platforms.
Limitations: most platforms aggressively cache OG previews. Once a URL is shared and the preview is fetched, updates to the source page do not propagate until cache expiry (Facebook: weeks; X: hours; Discord: indefinite per-message). Facebook's Sharing Debugger and LinkedIn's Post Inspector force a refresh; X has the Card Validator. For Discord, appending a fragment (#v2) bypasses the cache by treating the URL as new.
The about text and FAQ on this page were drafted with AI assistance and reviewed by a member of the Coherence Daddy team before publishing. See our Content Policy for editorial standards.