OG Image Size: 1200×630, Ratio, and Dimensions

The Short Answer

The recommended OG image size is 1200 × 630 pixels. That's the one number worth memorizing. I still see people make separate images for Facebook, LinkedIn, X, Slack, and WhatsApp. I don't. I make one 1200 × 630 image, keep important content away from the edges, and test the final URL.

If you are setting the tags by hand, include og:image, og:image:width, and og:image:height. Use the exact width and height values: 1200 and 630. That gives crawlers less to guess.

If you searched for OG image dimensions, og:image size, or OG image aspect ratio, the answer is the same: 1200 × 630 pixels, 1.91:1 ratio, JPG or PNG, and a file small enough that crawlers can fetch it quickly.

OG Image Size Specs

If you only need the numbers, use these. They cover the main Open Graph image dimension questions: size, aspect ratio, minimum resolution, file type, and the meta tags crawlers expect.

The Template I Use

My default template is boring on purpose: 1200 × 630 canvas, one strong headline, one small domain or brand mark, and no body copy. The feed shrinks everything. A clever layout at full size often turns into noise once it is inside a phone screen.

These are the rules I use before shipping an OG image:

• The headline still reads when the image is displayed at 500 pixels wide.
• The logo is visible but not the main character.
• All important text sits inside the center 80% of the canvas.
• The image URL returns a direct 200 response with no auth, no cookies, and no redirect.
• The final file is small enough that a crawler can fetch it quickly.

That last point matters more than people expect. Social crawlers are impatient. A perfect 2MB image that loads slowly is worse than a compressed 180KB image that appears every time.

OG Image Aspect Ratio

The OG image aspect ratio is 1.91:1. The common 1200 × 630 pixel size is just that ratio with enough resolution for large preview cards.

You can use larger images if they keep the same ratio, but I usually don't. 2400 × 1260 adds file size without changing much in a social feed. Smaller images work too, but once you go below 600 × 315, platforms may show a small thumbnail instead of the large card.

I would not use 16:9, 4:3, or a square image for the main og:image unless you are deliberately accepting crops. They can work, but they make every platform decide where to cut. A 1.91:1 image gives Facebook, LinkedIn, Slack, Discord, and messaging apps the shape they already expect.

Why 1200 × 630 Became the Standard

The 1.91:1 ratio is close to 16:9 video, but a little wider. It gives platforms enough horizontal space for a large preview card without making the image too tall in a feed. Facebook pushed the format first, then the rest of the web mostly settled around it.

1200 pixels wide is also a practical compromise. It stays sharp on high-density screens, but it is not so large that compression becomes painful. Go below 600 × 315 and platforms may drop you into a small thumbnail layout. That is usually the wrong outcome for a page you care about.

Platform Quirks Worth Knowing

Every platform has its own fetcher, cache, and display logic. I've generated thousands of OG images through MyOG. Here's what I've learned actually matters:

Facebook OG image size

Use 1200 × 630 pixels for Facebook OG images. Facebook can display smaller images, but 1200 × 630 gives you the large preview card and enough resolution for retina screens. Facebook caches hard. Update your OG image and nothing changes? Use the Sharing Debugger to force a re-scrape. The official limit is 8MB, but their crawler times out way before that on slow servers. Aim for under 300KB.

Twitter/X OG image size

Use 1200 × 630 pixels for Twitter/X large summary cards. Two card types: summary (square thumbnail) and summary_large_image (the big preview you actually want). Without the twitter:card meta tag set, you get the small thumbnail even if your image is perfectly sized. Easy to miss.

Google, SEO tools, and crawler previews

Google does not use your OG image the same way Facebook or LinkedIn does, but crawler tools still read the tags. Ahrefs, Slack unfurlers, browser extensions, and internal link preview tools all benefit from the same clean setup: absolute URL, correct dimensions, fast response, and a stable file format.

LinkedIn OG image size

Use 1200 × 630 pixels for LinkedIn link previews too. LinkedIn is the pickiest crawler of the bunch. It wants the ratio to be exactly right or it crops in ways that look broken — text cut off mid-word, logos sliced in half. I always test LinkedIn separately using their Post Inspector.

WhatsApp, Slack, Discord, and iMessage OG image size

WhatsApp, Slack, Discord, and iMessage all work well with 1200 × 630 OG images. They're usually more forgiving about dimensions than LinkedIn, but tighter on timeouts. If your image takes more than a couple seconds to load, you get a blank preview or a generic icon. Fast delivery matters here.

JPG vs PNG: A Practical Take

I'll skip the comparison tables. Rule of thumb: photography or gradients → JPG at 80-85% quality. Text, logos, flat colors → PNG. That's it.

Stick to JPG and PNG. A lot of platforms don't support SVG, GIF, or WebP for OG images. WebP produces smaller files, sure, but the compatibility risk isn't worth it. Your preview might just not show up.

Either way, compress. A 2MB PNG that looks identical to a 150KB optimized version just means slower previews and possible timeouts. Tools like our Image Compressor, ImageOptim, or Squoosh can cut file sizes by 60-80% without visible quality loss. If your image isn't the right aspect ratio, crop it to 1200 × 630 before compressing.

Designing for the Feed

Your 1200-pixel-wide image displays at roughly 500 pixels in most feeds. Less than half its actual size. Worth designing with that in mind:

• Text needs to be big. Anything under 40-50px at the source resolution becomes hard to read. Headlines work; paragraphs don't.
• Keep the edges clear. Platforms crop differently—some shave a few pixels off each side, others center-crop on mobile. The center 80% of your image is the safe zone.
• Test on mobile. Most link clicks come from phones. Your desktop preview might look great while the mobile version cuts off important text.

I also avoid putting essential text in the corners. Corners are where platforms add UI, rounded clipping, image counters, play badges, and other small bits of chrome. Put the headline in the middle third and the brand mark near an edge, but not touching it.

Retina Displays: Do You Need 2x?

Some guides say 2400 × 1260 for retina sharpness. I don't bother. Social feeds are noisy — nobody's zooming into your OG image to check pixel density. 1200 × 630 looks fine.

If your brand is built around premium aesthetics and your audience is mostly on new Apple hardware, maybe. For everyone else, it's over-engineering.

The Meta Tags

Here are the tags you need in your <head>:

<meta
  property="og:image"
  content="https://example.com/og.jpg"
/>
<meta
  property="og:image:width"
  content="1200"
/>
<meta
  property="og:image:height"
  content="630"
/>

<!-- For Twitter's large card format -->
<meta
  name="twitter:card"
  content="summary_large_image"
/>

Width and height tags aren't required, but they help platforms render previews faster — they know the dimensions before downloading the file. Two extra lines. Worth it.

I also keep the image URL boring. No signed URLs. No session-dependent routes. No image endpoint that needs the browser to run JavaScript first. If curl can fetch the bytes, the crawler probably can too.

Debugging Checklist

Image not showing up or looking wrong? Work through these:

1. Check the URL is absolute. Relative paths like /images/og.jpg don't work—use the full URL.
2. Verify the image loads. Paste the og:image URL directly in your browser. If it 404s or redirects, platforms can't fetch it either.
3. Clear platform caches. Facebook, Twitter, and LinkedIn all have debugger tools that force a re-fetch. Old cached versions can persist for days.
4. Check your server's response time. If your image takes more than 3-4 seconds to load, crawlers may give up.
5. Look for CORS or auth issues. Some CDNs or protected routes block crawler user agents.

Quick Answers

What size should an OG image be?

1200 × 630 pixels. This works on every major platform. Go smaller than 600 × 315 and you risk getting a thumbnail instead of a full preview card.

What file format works best?

JPG for photos and complex images. PNG for graphics with text or logos. Avoid SVG, GIF, and WebP—many platforms don't support them. Keep files under 300KB for fast loading.

Why isn't my OG image updating?

Platform caching. Facebook, Twitter, and LinkedIn all cache OG images—sometimes for days. Use their debugger tools to force a refresh after making changes.

Related Resources

• What are OG Images? — Learn the basics of Open Graph images
• OG Image Generator — Create correctly sized OG images
• OG Preview Tool — Test how your images appear on different platforms
• Image Cropper — Crop images to the exact OG image dimensions
• How to Add OG Images to WordPress — Step-by-step WordPress integration guide
• OG Image Testing Guide — debug social media previews that aren't working
• Favicon Generator — convert images to favicon format
• OG Meta Tags Guide — every OG tag explained with code examples
• MyOG.social vs @vercel/og — compare OG image generation approaches