What is the right og:image size?

1200×630 pixels, at a ratio close to 1.91:1. That is what Facebook, LinkedIn and X all downscale from without artefacts, and it is the shape they crop towards when the source is a different proportion. Keep the file under about 5 MB, and keep logos and text away from the outer 60 pixels, because the crop is not always centred.

Why does Facebook still show my old image?

The scraper caches what it fetched the first time somebody shared the URL, and it will keep serving that snapshot for a long while. Paste the URL into the Sharing Debugger and press Scrape Again to force a refetch. Changing the image filename works too, since a new URL has no cache entry to begin with.

Do I need Twitter Card tags if I already have Open Graph?

Not strictly: X falls back to og:title, og:description and og:image when the twitter: namespace is absent. Declare twitter:card anyway, because that is the one value with no Open Graph equivalent — it decides whether the link renders as a thumbnail beside the text or as a full-width picture.

Should og:url match the canonical tag?

Yes, and it is worth checking. Engagement counts are keyed on the exact string in og:url, so a page reachable at three URLs splits its shares three ways unless all three declare the same one. Point it at the same address as your canonical and the counts consolidate.

Why does this preview not load my image?

Because loading it would mean this page fetching a URL you typed from a third-party server, and nothing here talks to a server. The preview reports the address, the alt text and the ratio you declared, which is enough to catch a wrong path or a portrait crop before you publish.

Open Graph Generator with Card Preview

Write the tags, then read the card

This open graph generator writes the og: and twitter: tags that decide what a link looks like when somebody drops it into Slack, WhatsApp, LinkedIn or a group chat — and then describes the card those tags will produce, so you can catch a broken share before anyone sees it. Everything is built in the browser; no field you fill in is transmitted anywhere.

What each network actually reads

Open Graph began at Facebook in 2010 and became the default vocabulary by accident: LinkedIn, WhatsApp, Slack, Discord, Signal and Telegram all parse it, and X reads its own twitter: prefix first and then falls back to Open Graph for anything missing. In practice that means one well-formed Open Graph block covers almost every destination, and a single extra tag — twitter:card — covers the rest.

The tags do nothing for ranking. They decide whether a shared link arrives as a bare blue string or as a card with a picture, a headline and your site name, which is the difference between a link that gets clicked in a busy channel and one that does not.

1200×630, and why that exact rectangle

The number comes from the widest surface that renders these cards: a large-format post on a desktop feed. At 1200 pixels wide the image is served at native resolution there, and downscaled cleanly everywhere else. The height of 630 gives a ratio of roughly 1.91:1, which is the shape the crop targets.

Two consequences follow. First, an image below 200 pixels on either side is rejected and the card falls back to no picture at all. Second, anything squarer than about 1.7:1 gets cropped top and bottom — so a logo centred vertically survives, and a strapline sitting near the bottom edge is sliced off. The generator flags both cases, along with the width and height being declared without each other, which robs the client of the box it needs to reserve while the image loads.

Why the image will not update

Every one of these platforms caches aggressively, and the cache is keyed on the URL that was first scraped. Change the artwork at the same path and the old picture keeps appearing for days, which sends people hunting for a bug in markup that is already correct.

Facebook's Sharing Debugger is the fix and the diagnostic in one. Paste the URL and it shows exactly which properties its scraper parsed, which it could not fetch, and when it last looked; Scrape Again discards the cached copy and refetches. LinkedIn has an equivalent Post Inspector, and X invalidates on its own schedule. The reliable workaround, when you are in a hurry, is to publish the new artwork under a new filename.

og:url is a consolidation decision

og:url is the identity of the page as far as social platforms are concerned. Share counts, reaction counts and the entry in a platform's own index all hang off that string. If the same article is reachable with a tracking parameter, with and without a trailing slash, and on both www and the bare domain, four separate share tallies accumulate unless every variant declares one og:url.

Set it to the same address as the canonical tag. That is the whole rule, and it is why this tool and the meta tag generator ask for the same URL: one is telling search engines where the content lives, the other is telling social platforms.

A text preview, deliberately

The card preview here reports the type of card, the domain, the title, the description, the ratio you declared and the image address — but it does not fetch the picture. Rendering it would mean this page requesting a URL you typed from a server that is not yours, which is precisely the thing every tool on this site refuses to do. For a wrong path, a missing alt or a portrait crop, the text is enough.

When the page you are marking up is an article, pair these tags with structured data: the article schema generator writes the JSON-LD that describes the same page to search engines rather than to feeds.

Open Graph Generator