What is the best file format for OG images?

JPG and PNG are the only recommended formats for OG images. JPG is best for photographs; PNG is better for graphics with text or logos. Avoid SVG, GIF, and WebP as many social media platforms don't support them.

What is the maximum file size for OG images?

Facebook allows up to 8MB, Twitter/X up to 5MB. However, for fast loading and reliable display, keep OG images under 1MB. Large files may timeout when platforms try to fetch them.

OG Image Size Guide: Dimensions for Every Platform

Q: What size should an OG image be?

The recommended OG image size is 1200 x 630 pixels (1.91:1 aspect ratio). This size works well across all major platforms including Facebook, Twitter/X, LinkedIn, and messaging apps. Minimum size is 600 x 315 pixels.

The Short Answer

1200 × 630 pixels

1.91:1 aspect ratio

That's the one number worth memorizing. Facebook set this ratio when they introduced Open Graph, and every other platform followed. I've seen people spend hours researching platform-specific dimensions — 1200 × 630 works everywhere that matters.

Why 1200 × 630 Became the Standard

The 1.91:1 ratio isn't arbitrary. It's close to 16:9 video (1.78:1) but a bit wider — cinematic enough to look good, wide enough to fit vertical scroll layouts. Facebook picked it, and that was that.

1200 pixels wide keeps things sharp on high-density screens. Go below 600 × 315 and most platforms drop you into a small thumbnail layout. Not the large preview card you want.

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

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

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.

The pickiest crawler of the bunch. LinkedIn 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.

Messaging Apps

Slack, Discord, iMessage, WhatsApp — they all fetch OG images for link unfurls. Forgiving about dimensions, but tight 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.

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.

Debugging Checklist

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

Check the URL is absolute. Relative paths like /images/og.jpg don't work—use the full URL.
Verify the image loads. Paste the og:image URL directly in your browser. If it 404s or redirects, platforms can't fetch it either.
Clear platform caches. Facebook, Twitter, and LinkedIn all have debugger tools that force a re-fetch. Old cached versions can persist for days.
Check your server's response time. If your image takes more than 3-4 seconds to load, crawlers may give up.
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

Need OG images automatically sized?

MyOG.social generates perfectly sized OG images for every page — no manual work required.

Already have an account?