Skip to content
Devtools 360

Preview Open Graph and Social Share Cards

See how your page will look when shared in social feeds, microblogs, professional networks and chat apps. Paste the page's HTML source to extract its tags automatically, or type values to experiment.

Runs in your browserFree · No sign-upBrowser limitations apply

How to preview your share cards

  1. Open your page, view its source (Ctrl+U or ⌘+Option+U) and copy it.
  2. Paste it into the HTML box and click "Extract tags", or switch to "Edit fields" and type values directly.
  3. Review the four generic card previews and the checks list for missing or problematic tags.
  4. Fix the tags on your site (the Meta Tag Generator can write them) and repeat until every check passes.

Benefits

  • Works on staging and localhost pages that external debuggers can't reach — you just paste the source.
  • Checks the real dimensions of your og:image once it loads and warns when it's under the recommended 1200×630.
  • Pasted HTML is parsed as inert data, never executed or displayed.

Limitations

  • Live URLs can't be fetched from the browser because of CORS, so you need to paste the HTML source yourself.
  • Previews are generic approximations; each platform applies its own cropping, caching and quality rules.
  • Pages that inject tags with JavaScript after load won't show them in View Source; copy the rendered <head> from DevTools instead.
  • Image hosts that block hotlinking may refuse to display the og:image here even though crawlers can fetch it.

Privacy and security

Pasted HTML is read with the browser's DOMParser inside this page; scripts are not run and it is not sent anywhere. The only network request is loading your og:image URL for the preview, made with no referrer.

Read our privacy policy for details about the site as a whole.

Frequently asked questions

What size should an Open Graph image be?

1200×630 pixels (a 1.91:1 ratio) is the safest choice for large cards. Keep important text away from the edges because some platforms crop to a square or 2:1.

I updated my tags but the old preview still appears when I share.

Platforms cache link previews, often for days. Most offer a sharing debugger that lets you request a fresh scrape; changing the og:image URL (for example adding ?v=2) also helps.

Why can't I just enter a URL?

Browsers prevent a web page from reading other sites' content unless those sites allow it (CORS). Because this tool has no server, it can't fetch pages on your behalf.