OG image size: the 2026 guide to every platform

By the propzapi team · Last updated August 2026 · 9 min read

One number solves 90% of this. The other 10% is why your preview is blank right now.

The og image size that renders correctly almost everywhere is 1200×630 pixels at a 1.91:1 aspect ratio. That single file gives you the full-width large card on Facebook, LinkedIn, X, Slack and Discord. The Open Graph protocol itself sets no size; 1200×630 is Facebook's recommendation that the rest of the web standardized on. Below 600×315, the large card collapses to a small thumbnail.

I build propzapi, an image API, so the examples here use it. But most of this is platform truth that applies no matter how you make the image, and I'll flag where the "official" number is actually just convention.

What is the best og image size for every platform?

Use 1200×630 at 1.91:1. Facebook's own docs say to "use images that are at least 1200 x 630 pixels for the best display on high resolution devices," and to keep them "as close to 1.91:1 aspect ratio as possible." Every other network that reads Open Graph tags (LinkedIn, X's large card, Slack, Discord) renders that same file cleanly. The one real exception is Pinterest, which wants a vertical 2:3 image.

Here's the part most guides skip: the Open Graph protocol spec doesn't define a size at all. It only gives you the tags to declare one. The famous 1200×630 comes from Facebook's implementation guidance, and everyone copied it. So treat 1200×630 as a strong convention, not a law.

The real detail is per-platform, and this is the table the other articles won't give you with sources attached.

Facebook, X, LinkedIn, Slack and Discord all accept one 1200×630 file. WhatsApp accepts it too, but only if it's small (more on that below). Pinterest is the odd one out. If Pins matter to you, ship a separate 2:3 image, since Pinterest's own guidance says other ratios hurt performance.

What's the minimum og image size before the big card breaks?

600×315. Facebook's docs are explicit: "at the minimum, you should use images that are 600 x 315 pixels to display link page posts with larger images." Go below that and Facebook stops showing the full-width card and drops to a small square thumbnail next to your text. It's the difference between a post that stops the scroll and one that looks like a bare link.

So there are really two tiers. At 1200×630 you get a crisp large card on high-resolution screens. At 600×315 you still get a large card, just softer. Under 600px wide, you fall off the cliff into thumbnail land.

Because 1200×630 is exactly double 600×315, it doubles as your "retina" version. You don't need a separate 2x file, which is the next question everyone asks.

What size should a Twitter or X card image be?

For the large card, 1200×628, near-identical to your 1.91:1 Open Graph image. Per X's Cards documentation the image must be at least 300×157, no larger than 4096×4096, and under 5MB, in JPG, PNG, WEBP or animated GIF (first frame only). The small summary card is a 1:1 square with a 144×144 minimum. You trigger the large one with twitter:card = summary_large_image.

People tie themselves in knots over X's ratio. The Cards spec technically says 2:1, your Open Graph image is 1.91:1, and the gap is a couple of pixels nobody will ever see. Ship the 1200×630 file, add the twitter:card tag, and move on.

One thing worth knowing: X re-encodes uploads to JPEG, so a PNG with fine text can soften slightly. If your card is text-heavy, that's an argument for larger type, not a larger file.

What image format should an OG image be?

Use PNG for crisp text and logos, JPG for photos to keep the file small. WebP works on modern scrapers but some older unfurlers still choke on it, so PNG or JPG is the safe default for the one image that has to render everywhere. SVG isn't supported at all, and an animated GIF only ever shows its first frame. Declare the type with og:image:type so the crawler knows before it fetches.

Format is really a trade between text sharpness and file weight.

A share card is usually a headline on a solid background, which is what PNG does best: sharp edges, no compression fuzz on the type. If your card is a full-bleed photo instead, JPG at 80 to 90 percent quality gets you a far smaller file for the same look, which keeps you clear of the WhatsApp and Slack size ceilings.

WebP is tempting because it's smaller, and Facebook and X both handle it. But enough older or self-hosted link unfurlers still trip on it that I default to PNG or JPG when the image has to work on every surface. Save WebP for cases where you control the audience.

SVG never works, because scrapers don't run the renderer an SVG needs, so it comes back blank. One more tag worth setting is og:image:alt, a short text description of the image. It doesn't touch the size, but it's what a screen reader announces when someone shares your link, and almost no one bothers.

Where should the text go in an OG image?

Keep the important text in a centered safe zone, roughly the middle 90 percent of the frame, and make it big. Different placements crop the 1200×630 slightly differently, and small type that reads fine on your monitor turns to mush in a phone feed. A headline that fills a good third of the height survives every crop and every thumbnail scale-down.

The same image gets shown at wildly different sizes: full width in a desktop feed, a few hundred pixels across on a phone, a tiny square when a platform decides to thumbnail it. Your text has to survive all three.

So treat the outer edges as disposable. Center the headline, keep it away from the corners, and leave breathing room, because some placements shave a few percent off the sides or trim to a squarer crop. Anything important that sits near an edge is the first thing to get cut.

And size the type up more than feels natural. If it looks slightly too big at 1200×630 on your screen, it's about right in a real phone feed. Thin, small fonts are the single most common reason a technically-correct card still looks weak in the wild.

Do you actually need og:image:width and og:image:height?

You want them, even though they're optional. Facebook says declaring the dimensions lets the crawler "render the image immediately without having to asynchronously download and process it." The practical payoff: without them, the first time anyone shares a URL, the scraper hasn't cached the image yet and can render a blank preview that only fills in on a later scrape. Declaring 1200 and 630 reserves the space so the first share looks right.

This is the highest-value tag nobody talks about. Here's the full set worth shipping.

<!-- the tags that make a link preview correct -->
<meta property="og:image" content="https://example.com/og/post-42.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:type" content="image/png" />
<!-- so Discord, Slack and X render the LARGE card, not a thumbnail -->
<meta name="twitter:card" content="summary_large_image" />

The width and height tell the crawler the shape before it downloads a single byte. The twitter:card line is what promotes a link from a tiny side thumbnail to the big embed on X and Discord. Four lines, and your first-ever share stops looking broken.

Why isn't my OG image showing?

It's almost always one of five things, in this order: the og:image URL is relative instead of an absolute https URL; the image is behind a login the crawler can't pass; the URL returns HTML instead of an actual image; the file is over the platform's size limit; or the platform cached an old scrape. Work down that list, then force a re-scrape in each platform's debugger.

Run it as a checklist, because the failures are silent. No error, just a bare link.

Start with the URL. A relative /og.png or a protocol-relative //cdn/og.png fails, because Meta's WhatsApp docs require "an absolute URL for an image." Use the full https://…. Then open that URL in a private browser window. If it asks for a login or 404s, the scraper sees exactly what you do, and staging sites behind basic auth are a classic culprit.

Next, make sure it returns an actual image and not an HTML page that happens to contain one, or it won't unfurl. SVG is out too, since scrapers don't render it, so stick to PNG, JPG or WebP. Then check the weight. Facebook caps the file at 8MB, X at 5MB, and WhatsApp at 600KB (really closer to 250KB), and if the image is too heavy some platforms skip it without a word.

Last, bust the cache. Platforms cache the first scrape hard, so after you fix the tag, paste the URL into Facebook's Sharing Debugger, hit "Scrape Again," and do the same in X's Card Validator. Until you do, you'll keep seeing the old broken preview and assume nothing changed.

WhatsApp deserves its own line, because it's the sneakiest. Per Meta's own docs the image should be "under 600KB," but in practice WhatsApp drops the thumbnail well before that, often around 300KB, silently, and caches the miss. If WhatsApp is your channel, get the file under about 250KB.

How do you generate an OG image for every page automatically?

Stop hand-making one file. Render a correct 1200×630 image per page from a template plus that page's data, so the title, author or price is baked in and the size is right by construction. You can do it at build time with a library, or call an Open Graph image API that returns a signed URL you drop straight into og:image. Either way, every page gets its own on-brand card without a designer in the loop.

A single shared image across a whole blog is a missed impression. A per-post card with the actual headline gets clicked.

The build-time route is Vercel's OG / Satori: you write JSX, it renders a PNG at the edge. It's free and fast, with the catch that Satori only supports a subset of CSS, so complex layouts need rewriting into flexbox.

The hosted route is an API. With propzapi you sign a per-page URL and put it in the tag directly.

# sign a per-page image URL you drop straight into og:image
curl -X POST https://api.propzapi.com/v1/embed-url \
  -H "X-API-Key: pk_live_…" -H "Content-Type: application/json" \
  -d '{"template":"og-article","modifications":{"title":"Your post title"}}'
# → { "url": "https://api.propzapi.com/v1/og/og-article/…" }
# it renders 1200×630 on first fetch, then serves cached + free on every re-scrape

Because the image is already 1200×630, the endpoint sets the size for you, and the signed URL renders on first fetch then serves cached and free on every re-scrape, which matters when Facebook, X and Slack all hit it. The full option list is on the Open Graph Image API page, and there's a 50-image free trial with no card.

Frequently asked questions

Why is my OG image not showing on Facebook?

Almost always one of five things: the og:image URL is relative instead of an absolute https URL, the image sits behind a login so the crawler can't fetch it, the URL returns HTML instead of an image, the file is over the size limit, or the platform cached an old scrape. Fix the tag, then force a fresh scrape in Facebook's Sharing Debugger.

What size should a Twitter or X card image be?

For the large card (summary_large_image), use 1200×628, close to the 1.91:1 you already use for Open Graph. Per X's Cards documentation the image must be at least 300×157, at most 4096×4096, and under 5MB, in JPG, PNG, WEBP or GIF. The small summary card is a 1:1 square, minimum 144×144.

Do I need og:image:width and og:image:height tags?

You don't strictly need them, but you want them. Facebook says declaring the dimensions lets the crawler 'render the image immediately without having to asynchronously download and process it.' Without them, the very first share of a URL can show a blank preview until a later scrape catches up. Set them to your real pixel size (1200 and 630).

Does an OG image need to be 2x for retina?

No. 1200×630 is already enough. Social feeds render the image at roughly display size and don't let people zoom in, so a 2400×1260 version gains barely visible sharpness while adding real file size, which pushes you toward WhatsApp and Slack limits. Stay at 1200×630 and export around 80 to 90 percent JPEG quality.

Why is my WhatsApp link preview image not showing?

Usually file size. Meta's documentation says the image should be an absolute URL, under 600KB, and at least 300px wide. In practice WhatsApp drops the thumbnail well before 600KB, often around 300KB, and it does so silently and caches the failure. Compress the image under about 250KB and re-share from a fresh chat to test.

Why does Discord show a small thumbnail instead of a large image?

Discord shows the big embed when it sees a clearly landscape image or a twitter:card set to summary_large_image; otherwise it falls back to a small side thumbnail. Add the twitter:card=summary_large_image meta tag alongside your Open Graph tags and use a 1200×630 image, and the large embed appears under the text.

Ship 1200×630 and declare it

Make the image 1200×630 at 1.91:1, keep it under 1MB (under 250KB for WhatsApp), point og:image at an absolute https URL, and add the width, height and twitter:card tags. That covers every platform except Pinterest. If you're tired of exporting that file by hand for every page, generate it from a template instead. Grab a free key and put a signed /v1/embed-url straight into your og:image.

Get a free key Read the OG Image API guide