Your Open Graph image is the single most important visual asset on your blog post — and almost everyone gets it wrong. The post you spent six hours writing gets shared once, the link preview looks like a stretched, blurry stock photo with unreadable text, and nobody clicks. That's it. The post is dead in the water.
The good news: getting OG images right in 2026 is a 10-minute decision once you know the rules. This guide is the version I wish existed when I shipped my first blog. Exact dimensions, the safe-zone rule that survives every platform redesign, the text-to-image ratio that doubles click-through, and what specifically changed about Twitter, LinkedIn, and Facebook previews this year.
"OG" is short for Open Graph, the protocol Facebook open-sourced in 2010 that nearly every other platform now uses for link previews. When you paste a URL into Slack, Discord, iMessage, LinkedIn, X/Twitter, Facebook, WhatsApp, or Notion, those apps fetch your page and read three meta tags:
og:title — the headline shown above the imageog:description — one or two lines below itog:image — the image itself, which dominates the card visuallyThe image takes up roughly 70% of the card real estate on most platforms. Make it good and people stop scrolling. Make it generic and you blend into a thousand other links.
There's exactly one size that works on every major platform in 2026 without cropping or distortion:
1200 × 630 pixels, aspect ratio 1.91:1, under 5 MB, PNG or JPG.
This is the canonical size Facebook published in 2014 and every other platform reverse-engineered against. If you only do one thing on this page, use those dimensions. But here's how the platforms actually render that image as of 2026:
| Platform | Renders at | Notes |
|---|---|---|
| X / Twitter (large card) | 1200 × 600 | Crops 15px top + bottom. Keep critical content centered vertically. |
| 1200 × 627 | Slight bottom crop on mobile. Title overlays if you forget the meta tag. | |
| 1200 × 630 | Native. No crop. | |
| Slack / Discord | 1200 × 630 (scaled) | Slack scales to 360px wide on desktop — small text dies. |
| iMessage / WhatsApp | thumbnail | Scaled to ~80-200px. Logos and faces survive; body text doesn't. |
Don't make a separate image for each platform. One 1200 × 630 image, designed with Slack and iMessage in mind, will look great on Facebook and LinkedIn too. Designing for the smallest renderer is the cheat code.
Different platforms crop your image by 5-30 pixels at the edges. The fix: treat the outer 60 pixels on every side as a margin where nothing important lives. Logos, headlines, faces, and CTAs all stay inside the inner 1080 × 510 region. Background patterns and gradients can bleed to the edges — they're meant to be cropped.
This is the same principle TV broadcasters call the "title-safe area." It's boring, it costs you 10% of your canvas, and it's the difference between an OG image that looks intentional and one that looks broken on someone's iPhone.
Now the part everyone gets wrong. Designers shrink the headline to fit a 90-character title at "designer Twitter" font sizes. Then someone shares it on Slack and the text is unreadable.
The rule: the longest line in your OG image headline should be no more than 30-40 characters, set at 64-80px or larger. If your post title is longer than that, rewrite a punchier OG-only version for the image. The full title still goes in og:title — Twitter and Slack render the title as text underneath the image, so you don't lose information by shortening the on-image version.
Concrete font-size recommendations for a 1200 × 630 canvas:
If you can't read every character clearly when the image is scaled to 360px wide on a phone, the text is too small. Test by literally shrinking the image to thumbnail size and squinting.
Buffer ran a study across 2.4 million social posts in 2024 and found that link cards with 40-50% of canvas covered by text or graphic elements outperformed both text-heavy (>70%) and image-heavy (<20%) cards by 1.8-2.1x in click-through rate.
Translation: don't slap your headline over a full-bleed photo. Don't dump 15 words of body copy in size 24 either. Aim for a clean composition where text occupies roughly half the canvas and a graphic, illustration, or solid color block occupies the other half. Vertical or diagonal split layouts work especially well — they split attention naturally.
Eight templates, every one set to 1200 × 630 with safe-zone padding baked in. Type your headline, pick a color, download a PNG. No signup, no watermark, no email.
Try it free →Three things shifted this year that older OG image guides don't account for:
X (Twitter) deprecated summary as a Twitter card type in late 2025. Every link now renders as summary_large_image by default, which means: if you don't have a 1200 × 630 image, X composes a card from your title and a giant placeholder. It looks broken. Set twitter:card to summary_large_image explicitly and provide an image. No exceptions.
LinkedIn used to refetch your OG tags every share. As of Q1 2026, they cache for 7 days and the LinkedIn Post Inspector is the only way to force a refresh. Bake this into your launch checklist: hit the inspector before announcing.
iOS 19 (shipped late 2025) silently scores OG images and falls back to a plain link bubble if the image is below ~600px wide, has aspect ratio outside 1.5-2.0, or is over 5 MB. The "iMessage tax" for an oversized image is no preview at all. Compress aggressively — every 1200 × 630 PNG should be under 300 KB. Use Squoosh if you're hand-rolling.
After looking at hundreds of blog OG images that drove real traffic, the same five-element pattern shows up over and over:
That last one is the most underrated. When someone has seen three of your link cards in their LinkedIn feed and they all share the same accent color and layout, the fourth card gets recognition before they read it. Brands compound. One-off OG images don't.
The minimum viable meta block in your blog's <head>:
<meta property="og:title" content="Your post title">
<meta property="og:description" content="One or two sentences.">
<meta property="og:image" content="https://yourdomain.com/og.png">
<meta property="og:type" content="article">
<meta property="og:url" content="https://yourdomain.com/post">
<meta name="twitter:card" content="summary_large_image">
Hit X's card validator, hit LinkedIn's Post Inspector, and you're done.
og:image must be a full https://... URL, not a relative path. This breaks more launches than any other single mistake.og:image:width + og:image:height tags. Telling the platform the dimensions explicitly speeds up first render and sometimes unlocks the large-card preview where it would default to a small one.Before you publish, do this: paste the live URL into a Slack DM with yourself, then a LinkedIn draft, then an iMessage to yourself. If the preview looks great in all three, ship. If any one of them is broken — image missing, text unreadable, weird crop — fix before you publish, not after.
Most blog teams skip this and find out the OG image is broken three days later when a colleague mentions it. Burning 60 seconds before each post saves dozens of dead shares.
Eight pre-tested templates at 1200 × 630, safe zones built in, every color palette tested for contrast on Slack white and LinkedIn blue. Free, no signup, downloads as PNG.
Open the OG Image Generator →If you've got 50 archive posts without OG images, generate one for each. It takes a weekend. The traffic uplift from making 50 old posts shareable on social is usually larger than three months of new SEO content. Cheap, fast, ignored by 99% of bloggers — exactly the kind of edge that compounds.
Now: open the generator, set the meta tags, ship the post.