Open Graph Preview, See Your Facebook & LinkedIn Share Card Before You Post
Paste a page's HTML or fill in the og: fields and watch a faithful Facebook and LinkedIn share card render in real time, while a live audit flags every Open Graph tag that's missing, empty or the wrong size. Everything runs in your browser: your unpublished pages never leave your device.
What is the open graph preview?
Open Graph Preview renders faithful Facebook and LinkedIn share cards from pasted HTML or typed og: fields, auditing for a missing og:image, clipped title or description, and a non-absolute og:url. It copies a clean Open Graph block. Free and browser-based, never fetching live URLs, so unpublished and staging pages stay private.
The GigAI Open Graph Preview answers the one question a meta-tag editor can't: when someone shares this link, what will they actually see? Paste a page's HTML and we parse its og:title, og:description, og:image, og:url, og:type and og:site_name, plus the twitter:* fallbacks, with the browser's native DOMParser, then reconstruct the exact card Facebook and LinkedIn would build. Prefer to work forward? Switch to Fields mode and type the values. The card and the audit update on every keystroke. Because the two big feed networks crop and label cards differently: Facebook shows a full-bleed 1.91:1 image with a grey domain bar, LinkedIn a white meta bar with a bold title. We render both so you can confirm your link looks right everywhere it's shared. Alongside the preview sits an honest, actionable audit: it warns when og:image is missing (so the share collapses to a bare text card), when og:title or og:description will be clipped, when og:url isn't an absolute canonical, and when your image is too small or the wrong ratio for the large card. You get one-click copy of a clean, ready-to-paste Open Graph block built from your values, a download, and shareable links that reopen your exact card for a teammate. Crucially, we never fetch live URLs (a browser can't fetch arbitrary sites (CORS blocks it) and we deliberately run no server) so everything you paste or type stays on your device, is never logged, and is safe for staging, login-gated and client work. After you deploy, re-scrape the real URL in Facebook's Sharing Debugger or LinkedIn's Post Inspector so the networks pick up your new tags. This tool is how you get them right first.
- Difficulty:
- Easy
- Typical time:
- ~30s
- Processing:
- 100% browser processing
Last updated
How to use the open graph preview
- 1
Paste your page HTML
In Paste mode, view your page source (Ctrl+U / Cmd+Option+U), copy it and paste it in. We pull out the Open Graph and Twitter tags automatically.
- 2
Or fill in the og: fields
Switch to Fields mode to type og:title, og:description, og:image, og:url and og:site_name directly, handy when you're planning a page that doesn't exist yet.
- 3
Read the card and the audit
Toggle between Facebook and LinkedIn to see how the card renders on each, and scan the audit for any tag that's missing, clipped or the wrong image size.
- 4
Copy the fixed Open Graph block
Copy the clean og: tag block the tool generates from your values, paste it into your page's <head>, deploy, then re-scrape the live URL in each network's official debugger.
What Open Graph Preview includes
Paste HTML or type the fields
Drop a page's source and we parse its Open Graph and Twitter tags with the browser's native parser, or switch to Fields mode and type og:title, og:description, og:image and og:url yourself, the preview follows either way.
Faithful Facebook & LinkedIn cards
See both feed cards rendered the way each network really builds them, Facebook's full-bleed image with a grey domain bar, LinkedIn's white meta bar with a bold title, so you catch a broken share on the platform that matters.
Honest missing-tag audit
A live checklist flags exactly what's wrong: no og:image (card collapses to text), a clipped title, a missing description, a relative or absent og:url: each with a one-line fix.
og:image size & ratio check
Enter your image dimensions and we verify them against the 1200×630 (1.91:1) large-card ideal, warning when the image is too small to render or a near-square that drops to a tiny thumbnail.
Live as you type
Every edit re-renders the card and re-runs the audit instantly, so you can tune a title to fit or swap an image and see the result without a preview button in the loop.
100% in your browser
All parsing, previewing and validation happen on your device. No HTML, URL or unpublished page is ever uploaded, logged or seen: safe for staging and client work.
Why use our open graph preview
Never post a blank or image-less link again
A share with no og:image renders as a bare, low-click text card. Seeing the card before you post (and getting told the image is missing) means your link always unfurls rich and clickable.
Check the network your audience actually uses
Facebook and LinkedIn crop and label cards differently, so a share that looks great on one can break on the other. Previewing both means your link works wherever it lands.
Diagnose a broken share without guessing
When a link unfurls wrong, paste its HTML here to see precisely which tag is missing or malformed, instead of trial-and-error re-scraping in a debugger.
Preview drafts and client pages privately
Because it's all client-side, you can preview unpublished, staging and login-gated pages without exposing anything to a third-party server.
Built for the way you work
From quick one-off fixes to daily workflows, see how people put this tool to use.
- SEO specialist
Validate a page's social card before launch
Paste the built page's HTML to confirm every Open Graph tag is present and correctly sized, so the share card is rich and on-brand the moment it goes live.
- Social media manager
Fix a link that unfurls wrong
When a scheduled post's link preview looks broken, paste the page HTML here to pinpoint the missing or malformed tag, then get it corrected before the post publishes.
- Web developer
Confirm the tags the browser actually sees
Paste rendered HTML to check the exact og:* values the DOM exposes: catching a template that duplicates, omits or emits a relative og:url.
- Content marketer
Plan a share card before the page exists
Use Fields mode to draft og:title, og:description and an image concept, previewing the Facebook and LinkedIn card while the article is still in the outline stage.
Supported formats
Accepts HTML and Text, and produces HTML and TXT, all processed locally in your browser.
- HTML
- Text
- HTML
- TXT
Frequently asked questions
Recommended tools
Open Graph Generator
Build correct Open Graph (og:) meta tags and see a live Facebook and LinkedIn share-card preview as you type, copy the ready-to-paste markup, 100% in your browser.
Twitter Card Generator
Generate Twitter Card meta tags for X with a live card preview. Pick summary or large image, set the title, description, image and @handles, then copy the ready-to-paste twitter:* markup. 100% in your browser.
Meta Tag Analyzer
Paste a page's HTML to audit its title, description, canonical, robots, Open Graph and Twitter Card tags: with a length score, missing/duplicate checks and a live search & social preview, 100% in your browser.
Google SERP Preview
Preview exactly how your page appears in Google search (desktop and mobile) as you type your title, URL and meta description, with live pixel-width truncation warnings. Nothing is uploaded.
URL Encoder
Percent-encode text and URLs instantly: pick component mode for query values or full-URL mode to preserve structure, with a per-line batch switch. 100% in your browser, nothing uploaded.
Rich Results Preview
Paste JSON-LD or a page's HTML to detect schema types, validate required properties, and see which Google rich results your structured data is eligible for, 100% in your browser.
Common problems, solved
Hit a snag? Here are quick fixes for the issues people run into most.
My shared link shows no image on Facebook.
Your page is almost certainly missing a valid og:image, or the image is too small (Facebook needs at least 200×200, ideally 1200×630). Paste your HTML here to confirm the tag is present and absolute (https://…), add or fix it, then re-scrape the URL in Facebook's Sharing Debugger to clear the old cache.
The preview shows a different title than my page <title>.
Social networks prefer og:title over the HTML <title> when both exist. This tool mirrors that: if you set an og:title, the card uses it. To change the card headline, edit og:title specifically, not just <title>.
I pasted my URL but nothing loaded.
By design we never fetch live URLs. Browsers can't fetch arbitrary sites (CORS blocks it) and we run no server, for privacy. Switch to Paste mode and paste the page's HTML source, or use Fields mode to enter the values manually.
The card looks right here but still wrong when I actually share it.
Networks cache the first scrape of a URL aggressively. After deploying your corrected tags, force a fresh scrape in Facebook's Sharing Debugger and LinkedIn's Post Inspector: that's what refreshes the card they show to everyone.
Get the most out of it
Always set an explicit og:image: without it, shares collapse to a low-click, image-less text card.
Use a 1200×630 (1.91:1) image for the large card. Near-square images drop to a tiny thumbnail layout.
Make og:url an absolute, canonical URL: networks use it as the card's identity and cache key.
Set og:title separately from your <title> when you want a punchier headline in the feed.
After you fix tags, re-scrape the live URL in each network's debugger. The card is cached from the first visit.
What's new
Recent updates and improvements to the open graph preview.
Initial release, paste-HTML or type-fields modes driving a live Facebook & LinkedIn share card, a missing-tag audit, og:image size check, and copy/download of a clean Open Graph block.
Added Twitter/X fallback parsing, an image ratio warning against the 1200×630 ideal, keyboard shortcuts and shareable links that reopen your exact card.
Refined the audit copy with per-issue fixes, improved title/description clip thresholds to match the feed, and polished the empty-state guidance.
Keep exploring
Related tools
Problems we solve
Definitions
From the blog
Explore categories
Compare formats
Common tasks
Your privacy is built in
Every preview, parse and audit happens entirely in your browser. Nothing is uploaded to any server. We deliberately do not fetch live URLs, so your HTML, Open Graph fields and unpublished or internal pages never leave your device, are never logged, and are never seen by anyone. Close the tab and every trace is gone.
- Runs in your browser
- No uploads
- Nothing stored
Ready to try the open graph preview?
Free, private and instant. Open Graph Preview runs right in your browser.