Open Graph Preview

Enter the title, description and image you plan to use for Open Graph tags and see approximate link cards for Facebook, LinkedIn, X (both card types), WhatsApp and Slack side by side. A checklist flags missing or oversized values, and the matching meta tags are generated with proper HTML escaping, ready to paste into your page head.

SEO Runs in your browser

Preview Your Open Graph Share Cards

If you enter an image URL, your own browser downloads that image directly from the address you type (a normal image request). Nothing is sent to TinySandy.

Recommended size: 1200 × 630 px. Leave empty to see the no-image layout.

How to Use the Open Graph Preview

  1. Fill in the title, description, site name, canonical URL and the address of the share image.
  2. Choose the twitter:card type and og:type.
  3. Compare the cards for each platform and read the checks about lengths and the image.
  4. Copy the generated meta tags into the <head> of your page.

About This Tool

Bloggers, marketers, developers and designers who share links on social media and want to check the card before publishing, and anyone debugging why a shared link looks wrong.

Input: Title, description, image URL  ·  Output: Previews and meta tags.

Features and Limitations

Features

  • Six approximate cards: Facebook, LinkedIn, X summary_large_image, X summary, WhatsApp and Slack.
  • Loads the image in your browser and reports its real pixel size.
  • Shows a text placeholder when the image is missing, invalid or cannot be loaded.
  • Generates escaped og:* and twitter:card meta tags.
  • No account, no server; the page itself never uploads your content.

Limitations

  • The cards are approximations. Each platform crops, truncates, caches and redesigns its cards on its own schedule, so the real result can differ.
  • The preview cannot see what platforms have cached. After changing tags you may need to re-scrape the URL with the platform's own debugger tool.
  • The image is requested by your browser. Sites that block hotlinking, require a login or send the wrong content type will show the failure placeholder even if a platform could fetch it.
  • The tool does not read tags from a live page; it previews the values you type.
  • Results are computed in your browser; nothing you enter is sent to a server.

Example

A title of “How to Write a Better Meta Description”, an article type and a 1200 × 630 px image gives a large card on Facebook and X with the title below the image, while the generated tags include og:type article and twitter:card summary_large_image.

Frequently Asked Questions

What image size works best for og:image?

1200 × 630 px (about 1.91:1) is the common recommendation. Keep the image under a few megabytes, use https and place key content away from the edges because platforms crop differently.

Why does my shared link still show the old preview?

Platforms cache link previews. Use the platform's sharing debugger or post inspector to refresh it. This tool cannot clear another site's cache.

Do I need both og: and twitter: tags?

X reads twitter:card and falls back to Open Graph tags for the title, description and image, so a complete set of og tags plus twitter:card is usually enough.

Does the tool upload my image?

No upload happens. If you enter an image URL, your browser fetches it from that address to display the preview and measure its size, exactly like opening the image in a new tab.

Do Open Graph tags affect SEO rankings?

They do not directly influence Google rankings. They control how your link looks when it is shared, which can affect clicks from social platforms and messaging apps.

Related Tools

More like this: all SEO tools, all Developer & Web tools or the TinySandy home page.