Generate Open Graph meta tags and Twitter Card tags with a live social preview. See exactly how your link looks on Facebook, Twitter, and LinkedIn before publishing. Free online OG tag generator.
This free Open Graph generator creates HTML meta tags that control how your URL appears when shared on social media. Enter your title, description, image URL, and page URL — get the OG tags instantly and see a live preview of your Facebook and Twitter card before publishing.
Open Graph is a metadata protocol created by Facebook in 2010 that lets any webpage become a rich object in a social graph. When you share a URL on Facebook, Twitter/X, LinkedIn, WhatsApp, Slack, Discord, or iMessage, those platforms use Open Graph tags embedded in the page's HTML head to generate a rich link preview card — showing a title, description, and image instead of a plain URL. Without Open Graph tags, platforms scrape random text and often produce poor or missing previews. Studies show rich social previews get 2-3x more clicks than plain URL text.
Open Graph tags look like this in your HTML head:
<meta property="og:title" content="Page Title"> <meta property="og:description" content="A summary."> <meta property="og:image" content="https://example.com/image.jpg"> <meta property="og:url" content="https://example.com/page">
Open Graph data (OG data) is the structured information encoded in a page's Open Graph meta tags. It consists of key-value pairs that social platforms and link crawlers read to understand what a URL represents. The core Open Graph data points are: og:title (the headline, 50-60 chars), og:description (a summary, 155-160 chars), og:image (preview image URL, 1200x630px ideal), og:url (canonical page URL), og:type (content type: website, article, video), and og:site_name (your brand name). This data is used by Facebook, Twitter, LinkedIn, WhatsApp, Slack, Discord, messaging apps, and browser extensions that display link previews.
The ideal OG image dimensions are 1200 x 630 pixels (1.91:1 aspect ratio). This renders correctly on Facebook, LinkedIn, and most platforms. Twitter summary_large_image requires 800 x 418px minimum. Keep file size under 8 MB. Use JPG for photos, PNG for images with text or logos. Avoid important content near the edges — platforms may crop on mobile.
Twitter has its own meta tag system (Twitter Cards) that falls back to Open Graph tags when Twitter-specific tags are absent. Best practice: include both. OG tags are read by Facebook, LinkedIn, WhatsApp, Slack, Discord, and more. Twitter Card tags (twitter:title, twitter:description, twitter:image) override OG tags for Twitter/X only. The twitter:card tag controls layout: summary (small image, left-aligned) or summary_large_image (large banner).
Open Graph tags are HTML meta tags that control how a webpage appears when shared on social media — defining the title, description, and preview image. They are placed in the HTML head section and read by Facebook, LinkedIn, Twitter, WhatsApp, Slack, and most other platforms.
Open Graph data is the set of og: meta tags embedded in a page's HTML head. It tells social platforms the canonical title, description, image, and content type to use when generating a link preview card. It was created by Facebook in 2010 and is now a universal standard.
Generate the tags with this tool, then paste them inside the head section of your HTML. For WordPress use Yoast SEO or Rank Math. For React apps use react-helmet or next/head. For Next.js use the metadata API or Head component.
The recommended size is 1200 x 630 pixels (1.91:1 ratio) for Facebook and LinkedIn. Twitter summary_large_image works at 800 x 418px minimum. Keep files under 8 MB, use JPG or PNG.
Facebook caches OG previews for days or weeks. Use the Facebook Sharing Debugger (developers.facebook.com/tools/debug) — enter your URL and click Scrape Again to force a cache refresh.
OG tags don't directly affect Google search rankings, but they improve social click-through rates, which drives traffic and can generate backlinks — both of which indirectly benefit SEO.