Social Media Image Sizes 2026: The Definitive Reference

Every social platform has its own image dimensions, aspect ratios, and file size limits. Post an image sized for Instagram on LinkedIn and it gets cropped awkwardly. Share a link on Twitter without an OG image and your post looks bare compared to competitors who set one up.

This reference covers every major platform as of 2026. Bookmark it. You will come back to it more often than you expect.

The Complete Size Reference

Here is every platform, every surface, every pixel dimension you need to know. These are the recommended sizes, meaning the exact dimensions each platform is optimized to display.

OG Protocol: The Meta Tags That Control Link Previews

When someone shares a URL on Facebook, LinkedIn, Discord, Slack, or iMessage, those platforms look for Open Graph meta tags in your HTML. The og:image tag is the one that determines which image appears in the link preview. Without it, the platform either picks a random image from your page or shows nothing.

<!-- Open Graph (Facebook, LinkedIn, Discord, Slack) -->
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="A concise description of the page." />
<meta property="og:image" content="https://yoursite.com/og-image.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:type" content="image/png" />
<meta property="og:url" content="https://yoursite.com/page" />
<meta property="og:type" content="website" />

<!-- Twitter/X Card -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Page Title" />
<meta name="twitter:description" content="A concise description of the page." />
<meta name="twitter:image" content="https://yoursite.com/twitter-card.png" />

In Next.js App Router, you can set these in your layout or page metadata:

export const metadata = {
  openGraph: {
    title: 'Your Page Title',
    description: 'Page description for link previews.',
    images: [
      {
        url: 'https://yoursite.com/og-image.png',
        width: 1200,
        height: 630,
        alt: 'Description of the image',
      },
    ],
  },
  twitter: {
    card: 'summary_large_image',
    title: 'Your Page Title',
    description: 'Page description for link previews.',
    images: ['https://yoursite.com/twitter-card.png'],
  },
}

Aspect Ratios Compared

The core tension: some platforms want landscape images (Facebook, Twitter, LinkedIn) and others want square or portrait (Instagram, TikTok, Pinterest). Here is how the aspect ratios stack up:

Notice how Facebook and LinkedIn share the exact same 1.91:1 ratio. Twitter is close at 16:9 (1.78:1). This is not a coincidence. Facebook invented the OG protocol, LinkedIn adopted it, and Twitter came close enough that a single image usually works for all three with minor cropping.

OG Images vs Profile Avatars

These are fundamentally different assets serving different purposes, and confusing them is a common mistake.

OG images are page-level. Each URL on your site can have its own OG image. They appear when someone shares a link. They are landscape format (1200x630 for most platforms). They should include a title, branding, and a visual that conveys what the page is about. Think of them as social media billboards for your content.

Profile avatars are account-level. You have one per social media account. They are square and displayed small (often under 100px). They should be your logo or brand mark, simple enough to recognize at tiny sizes. The same design principles that apply to favicons apply here: simplicity, bold shapes, high contrast.

Making One Image Work Across Platforms

Creating a separate OG image for every platform is ideal but rarely practical. Here is the compromise that works for most teams:

Use 1200x630 as your default. This is the Facebook/LinkedIn native size and works well on Twitter (which crops a thin strip from top and bottom to fit 16:9). Discord uses the same OG tags as Facebook. Slack does too. One 1200x630 image covers five platforms with no visible issues.

Keep critical content in the center 1200x600 area. Twitter's 16:9 crop removes about 15 pixels from the top and bottom of a 1200x630 image. If your text or key visuals are centered vertically, the crop is invisible.

Add padding around text. Give your title text at least 60 pixels of padding from all edges. Some platforms add rounded corners or overlay UI elements near the edges. Padding keeps your text safe.

Use PNG for text-heavy images, JPEG for photos. Text gets compression artifacts in JPEG, especially at the lower quality levels platforms sometimes use. PNG keeps text crisp. For photographic images, JPEG at 85% quality keeps file sizes reasonable.

Test with the platform debuggers. Facebook has the Sharing Debugger (developers.facebook.com/tools/debug), Twitter has the Card Validator (cards-dev.twitter.com/validator), and LinkedIn has the Post Inspector (linkedin.com/post-inspector). Run your URL through all three before launch.

Platform-Specific Gotchas

Facebook aggressively caches OG images. If you change your image, it might not update for days unless you manually clear the cache via the Sharing Debugger. Also, images smaller than 600x315 are displayed as a small thumbnail instead of a large card, which looks much less compelling in feeds.

Twitter/X requires the twitter:card meta tag to be set to summary_large_image for the large preview. Without it, you get summary by default, which shows a tiny 240x240 thumbnail instead of the full-width image. This is the single most common Twitter card mistake.

LinkedIn has a maximum file size of 5 MB and strongly prefers PNG. JPEG works but LinkedIn's compression can introduce artifacts. If your image looks blurry on LinkedIn but fine elsewhere, try switching to PNG.

Discord reads OG tags but also supports oEmbed for richer embeds. For most sites, standard OG tags are sufficient. Discord displays the image, title, description, and site name in a left-bordered card. The embed image follows the 1200x630 standard.

Pinterest is the outlier. It favors tall, portrait-oriented images (2:3 ratio, 1000x1500). If Pinterest is important to your traffic strategy, you need a separate image. A landscape OG image displays as a small, hard-to-read strip on Pinterest.

File Size Recommendations

Every platform has a maximum file size, but the practical limit is lower. Large images take longer to load in previews, and some platforms show a placeholder while the image loads (or skip it entirely if loading takes too long on their end).

Aim for 200-400 KB for your OG images. That is large enough for sharp text and good photo quality at 1200x630, but small enough that platforms display it instantly. Run your images through a tool like Squoosh or TinyPNG before deploying.

Generating OG Images Dynamically

If you have hundreds or thousands of pages (blog posts, product pages, documentation), creating OG images manually is not sustainable. The modern approach is generating them at build time or on demand.

Next.js has built-in OG image generation via next/og using the ImageResponse API. Vercel's @vercel/og package renders JSX to PNG on the edge. Other options include Cloudinary's URL-based transformations and open-source tools like satori.

import { ImageResponse } from 'next/og'

export async function GET(request: Request) {
  const { searchParams } = new URL(request.url)
  const title = searchParams.get('title') ?? 'Default Title'

  return new ImageResponse(
    (
      <div style={{
        width: '100%',
        height: '100%',
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'center',
        background: 'linear-gradient(135deg, #667eea, #764ba2)',
        color: 'white',
        fontSize: 48,
        fontWeight: 700,
        padding: 60,
      }}>
        {title}
      </div>
    ),
    { width: 1200, height: 630 }
  )
}

This gives you a unique, branded OG image for every page on your site without maintaining a folder of static images. The tradeoff is slightly more complex deployment and the need to test that the generated images look right across platforms.

The Bottom Line

Start with 1200x630 PNG for your OG images. That single size covers Facebook, LinkedIn, Twitter (with minimal crop), Discord, and Slack. Set up both og:image and twitter:card meta tags. Test with each platform's debugger tool.

If you need platform-specific images, Pinterest (1000x1500) and Instagram (1080x1080) are the ones that diverge most from the standard. Everything else is close enough to 1200x630 that cropping differences are invisible.

For profile avatars, upload the largest square the platform accepts and let it handle the resizing. Keep the design simple. Your avatar appears at 32 pixels in most comment threads, and if people cannot recognize it at that size, it is not doing its job.