Social Media Preview

Preview how your link renders across social platforms.

What it does

This tool mocks up how a shared link might look as a card on Facebook or LinkedIn and on X (Twitter). You type a title, description, URL and image address, and both previews update as you type. It is a drafting aid: it does not fetch your page or read its Open Graph tags, and it does not write any tags for you. The only thing it loads is the image, which your browser requests straight from the address you give.

How to use it

Enter the headline you plan to use in og:title in the Title field.
Add your og:description text in Description. Both cards show only its first 100 characters.
Type the page address in URL. The cards show just the domain, taken from the address with the protocol and path removed.
Paste a full image address into Image URL to see it fill the top of each card.
Adjust the wording until both cards read well, then put the final values into your page's og: and twitter: meta tags.

Where the mockup and the real card differ

The previews are simplified. Each image is cropped to fill a fixed box 150 pixels tall, so it will not show the exact framing a platform uses; for link cards, a landscape image around 1.91:1, such as 1200 by 630 pixels, is the usual choice. The title is never shortened here, while the real networks cut long titles to fit their layouts, and those layouts change from time to time. If you clear the Image URL box, the previous picture stays until you reload the page.

The real test happens after publishing. Networks read the tags from your live page and cache what they find, so run the URL through Facebook's Sharing Debugger or LinkedIn's Post Inspector to see their version and refresh the cache after you change anything. X falls back to Open Graph tags when twitter: tags are missing.

Social Media Preview