How to use Open Graph Preview

Enter the title and description for the link card you want to share.
Add the page address and site name, and choose one local image for the visual preview. A card without them is a draft you can still edit.
If your site hosts the image, enter that address for the code snippet. The preview updates as you change the fields.

Example: Open Graph Preview

Check a guide's social card using the image that will accompany the shared link.

You add

Card title: Slow-roasted coffee guide. Card description: A practical guide to roasting coffee slowly at home. Page address: https://beanexample.com/guides/slow-roast. Site name: Bean Example. Local preview image: a 1200 by 630 pixel PNG. Image address: https://beanexample.com/images/slow-roast.png.

You get

The card shows the selected image, title, description and site name. The copyable code lists og:type, og:title, og:description, og:url, og:site_name and og:image, so it carries every required tag, and it uses the entered image address. The local image row reports 1200 by 630 pixels.

Options

Local preview image: A selected image is used only for this browser preview. Choosing a file here does not upload or publish it, so it cannot become a public og:image address.
Image address: Enter the address of an image you host on your own site. The tool checks only that the address is a full http or https URL; it cannot prove the file is reachable. The address is written into the sample og:image tag and is never fetched here.
Site name: This optional field helps identify your site in the preview and sample tags. A social app may display or omit it.

Supported inputs and limits

This tool previews text and an optional local image without fetching a page or a remote image. The image preview is a local draft, and sample tags do not publish your metadata. The Open Graph protocol requires og:type, og:title, og:image and og:url, so the result marks a sample as a draft when og:url or og:image is missing. Address checks cover the URL shape only; they do not prove a page or image is reachable. Social apps choose their own crop, layout and cached version, so check the actual share after your site is updated. Nothing you enter is uploaded by this tool.

Where your input is processed

This tool processes your input in this browser. Your text and files are not uploaded to UseFreeTools. Check this tool's limits for anything it may save on your device.

What the sample tags need on your real page

The Open Graph protocol defines og:title, og:type, og:image and og:url as basic page properties, with og:description optional. A preview image picked from your device has no public URL by itself. Add the tags to the page's HTML, host the image at the address in og:image and check the finished link in a sharing app.

The Open Graph protocol, Basic Metadata (checked 2026-09-26)

Questions about Open Graph Preview

Why doesn't my local image appear when I share the link?

The file is only opened in your browser for this preview. Upload it to your site and put that address in your page's og:image tag so a social app can request it.

Does this tool read the Open Graph tags already on my page?

No. The page address is only draft text here. The tool does not fetch your website or check whether the sample tags were installed.

Will every social app show the same card?

No. Each app can crop the image, shorten text or show a cached version. Use the preview to plan the card, then test a real share on the apps that matter to you.

Does the tool check that my page or image address works?

No. It checks that the address is a full http or https URL. Load the page and the image in a browser yourself before you rely on them, because a tag with a broken address is still an incomplete card.

Project manager: Tony Hines · Content updated 29 September 2026 · Report a problem

Open Graph Preview

Preview social card controls