Open Graph & Twitter Card Generator

Generate and preview Open Graph (OG) and Twitter Card meta tags. Ensure your links look perfect when shared on Facebook, LinkedIn, X, and WhatsApp.

Built and maintained by Shehzad Munir ·

Needs the internet: the page's meta tags are fetched on our server. Nothing is stored after the request.

Open Graph & Twitter Card Generator
Loading Social Metadata Studio
  • SEO Tools
  • Free · No sign-up
  • Uses the internet
  • 6 features
Share
Cite or link to this tool

Using this tool in an article, lesson or report? Copy a ready-made link or citation.

HTML link

<a href="https://www.toolnova.org/seo-tools/social-metadata-studio">Open Graph &amp; Twitter Card Generator</a> by ToolNova

APA

ToolNova. (2026, September 5). Open Graph & Twitter Card Generator [Online tool]. https://www.toolnova.org/seo-tools/social-metadata-studio

MLA

“Open Graph & Twitter Card Generator.” ToolNova, 5 Sept. 2026, www.toolnova.org/seo-tools/social-metadata-studio.

Design perfect social share previews

The Open Graph & Twitter Card Generator creates and previews the meta tags that control how your links look when shared on Facebook, LinkedIn, X, and WhatsApp. A well-configured card turns a bare URL into a rich, click-worthy preview with the right title, description, and image.

The metadata studio lets you craft and preview the Open Graph and Twitter Card tags that control how your links look when shared on X, Facebook, LinkedIn, and Slack. A compelling title, description, and image can dramatically raise click-through from social, traffic that also sends positive engagement signals.

Features

  • Open Graph (OG) & Twitter Card tag generator
  • Live previews for Facebook, X, LinkedIn, WhatsApp, Discord & Slack
  • Summary vs summary_large_image Twitter card switch
  • Import & auto-fill tags from any existing URL
  • Per-platform length validation & warnings
  • Ready-to-copy meta tags with HTML export

How to use Open Graph & Twitter Card Generator

  1. 1

    Enter your page details

    Add the title, description, image URL, and page URL.

  2. 2

    Preview the card

    See a live snippet of how the link will appear across platforms.

  3. 3

    Copy the tags

    Grab the ready-made Open Graph and Twitter Card meta tags.

  4. 4

    Add them to your page

    Paste the tags into your page's <head> and test the share.

Common use cases

  • A blogger makes shared posts show a proper title and image.
  • A marketer ensures a campaign link looks polished on LinkedIn.
  • A developer adds Open Graph tags to a new landing page.
  • A store owner fixes a broken share preview on Facebook.

Detailed guide

Stop broken or ugly link previews

Missing or malformed metadata causes blank thumbnails and truncated titles that quietly kill shares. Generate correct, ready-to-paste tags and see exactly how each platform will render your page, so every link you post looks intentional and on-brand.

Frequently asked questions

What are Open Graph tags and why do I need them?

Open Graph (OG) tags are HTML meta tags that control how your webpage appears when shared on social platforms. Without them, Facebook and LinkedIn will use random text and images from your page, resulting in poor-looking shares.

How do I add Open Graph tags to my website?

Use this generator to create your OG tags, then paste them inside the <head> section of your HTML. Key tags: og:title, og:description, og:image (must be 1200×630px), og:url, and og:type.

What size should the og:image be?

The recommended og:image size is 1200×630 pixels (1.91:1 aspect ratio). This works across Facebook, LinkedIn, and X/Twitter. Minimum size is 600×315px, but larger images display more prominently.

What is the difference between Open Graph and Twitter Cards?

Open Graph tags work on Facebook, LinkedIn, Pinterest, and WhatsApp. Twitter Cards are Twitter-specific meta tags. Both serve similar purposes, controlling the preview appearance, but use different tag names (og: vs twitter:).

How do I test my Open Graph tags?

Use the preview in this tool, or test directly with: Facebook Sharing Debugger (developers.facebook.com/tools/debug), Twitter Card Validator (cards-dev.twitter.com/validator), or LinkedIn Post Inspector.

What happens if I don't add Open Graph tags?

Without OG tags, social platforms scrape your page and pick random content, often a blurry thumbnail, the wrong title, or a truncated description. This leads to significantly fewer clicks when your content is shared. Pages with proper OG tags see 2-3x higher click-through rates on social media.

How do I add Open Graph and Twitter Card tags to my site?

Fill in your title, description and image URL and the generator outputs the og: and twitter: meta tags. Paste them into your page's head so links show a rich preview on Facebook, X, LinkedIn and Discord.

Why does my link not show an image when shared?

Usually the og:image tag is missing or the image is too small. Generate a complete set of Open Graph tags (with a correctly sized image) and preview how the link will appear before you publish.

Can I preview how my link looks on different platforms?

Yes. The studio shows a live preview of the share card for platforms like Facebook, X/Twitter and LinkedIn, so you can fine-tune the title, description and image.

What's the difference between Open Graph and Twitter Cards?

Open Graph controls previews on most platforms (Facebook, LinkedIn, WhatsApp); Twitter Cards are X's own format. Setting both covers every major network.

From the journal

All articles →
How to Remove EXIF Metadata From Your PhotosTool Guides

How to Remove EXIF Metadata From Your Photos

Photos carry hidden data like GPS location and camera details. Here's why that matters for privacy and how to strip it before sharing.

SM
Shehzad Munir
Aug 19, 2026 · 3 min
What Is CPS? How to Test and Improve Your Click SpeedTool Guides

What Is CPS? How to Test and Improve Your Click Speed

CPS means clicks per second. Here's how it's measured, what a good score looks like, and how to test your own click speed for free.

SM
Shehzad Munir
Aug 17, 2026 · 3 min
How to Merge PDF Files for Free (Without Uploading Them)Tool Guides

How to Merge PDF Files for Free (Without Uploading Them)

Combine several PDFs into one document, reorder the pages, and keep everything private — no software and no server upload.

SM
Shehzad Munir
Aug 14, 2026 · 2 min