Open Graph1200×630
Open Graph image
The 1200×630 card Slack, iMessage and most crawlers actually show.
Open the tool
Social cards, at the size each network renders
Open Graph is one protocol and about six crops. Each page locks the canvas, composes the PNG in this tab, and never uploads the file.
Slack, iMessage, X, Facebook, LinkedIn, Discord — 1200×630 and the few crops that actually differ. Composed in this tab.
slack · #launch
# launch
3you2:14 PM
shipped the landing page
image.dev
Generate an Open Graph image
1200×630, composed in the tab. Nothing is uploaded.
Marketing
Generate Beautiful
Open Graph Images
4 2
Every generator
Six pages, six search intents. The tool itself is the next click.
Twitter / X card1200×628
Twitter / X card
summary_large_image at 1200×628 — two pixels shorter than Facebook’s number.
Open the tool
Facebook1200×630
Facebook share
Same 1200×630, plus the Sharing Debugger cache ritual.
Open the tool
LinkedIn1200×627
LinkedIn share
1200×627. Confirm the scrape in Post Inspector before you post.
Open the tool
Discord1200×630
Discord embed
A dark-friendly 1200×630 og:image. No bot, no webhook.
Open the tool
X header1500×500
X header
1500×500 profile ribbon. Type sits clear of the avatar.
Open the tool
Questions
Sizes, tags, and why a screenshot is the wrong file.
What size should an Open Graph image be?
1200×630, a 1.91∶1 card. Slack, iMessage, LinkedIn and WhatsApp still consume that Facebook number. X’s large card is 1200×628; LinkedIn is 1200×627. One 1200×630 PNG covers almost every unfurl.
Do I need a different file per network?
Usually no. Export one 1200×630 PNG, point og:image at it, and let X fall back. Use the X, LinkedIn or header pages when you are designing for that crop, not as a reason to host three near-identical files.
Why not screenshot the page?
Crawlers crop aggressively, UI chrome survives, and type that was readable at 1440px becomes mud at 600. A purpose-built 1200×630 card is the file the protocol asked for — one title, one idea, no browser chrome.
Will Slack and iMessage pick this up automatically?
They will if the live HTML has og:image pointing at a public HTTPS URL, plus og:title and og:description. This studio only makes the pixels. Host the PNG, put the absolute URL in the tag. Crawlers do not see localhost.
PNG or JPG for og:image?
PNG when the card has type, a logo or a flat background. JPG only when the whole card is a photograph. These tools write PNG because type-led cards are the common case.
Why not generate these on the server with next/og?
You should, for production pages that change with the route. This hub is the other job: designing a one-off share image you will upload to a CMS. Server generation needs a deploy; this needs a download.
Composed on your device — nothing is uploaded