Open Graph Preview
See how your link looks when shared.
How to use
- 1 Enter your og:title and og:description.
- 2 Add the page URL and an absolute image URL.
- 3 Check the rendered share card and any warnings.
- 4 Copy the generated Open Graph meta tags into your page head.
About Open Graph Preview
Open Graph Preview shows you exactly how a page will appear when its link is pasted into Facebook, LinkedIn, Slack, Discord or a chat app, without publishing anything first.
You type the values you intend to put in your page head — og:title, og:description, og:url, og:image and og:site_name — and the tool renders a faithful share card on the right: the thumbnail, the domain, the bold headline and the muted description, laid out the way social platforms render them.
Because previews are built entirely from the values you supply, nothing is fetched and no URL is ever contacted; the work happens locally in your browser, so it is safe for staging sites, internal tools and pages that are not live yet.
The tool also flags common mistakes: titles that exceed the length most platforms truncate at, descriptions that run too long, a missing description, or an og:image that is not an absolute http(s) URL and therefore will not load.
When the card looks right, copy the generated block of Open Graph meta tags straight into your document head.
It is a fast feedback loop for getting share previews looking sharp before the page goes out, and it keeps your private drafts private.
FAQ
Does this fetch my page or image?
No. The preview is built only from the values you type, so nothing leaves your browser and unpublished pages stay private.
Why does my image not show?
og:image must be an absolute http(s) URL. Relative paths and non-web schemes are flagged and will not render as a thumbnail on social platforms.
How long should my title and description be?
Aim for under 60 characters for the title and under about 110 for the description; longer values are warned about because platforms truncate them.