Open Graph Image Size and Best Practices 2026

Recommended OG Image Size

**1200 x 630 pixels** — this is the standard that works across all platforms.

Size Requirements by Platform

The Essential OG Tags

<meta property="og:title" content="Your Page Title">

<meta property="og:description" content="A compelling description under 200 chars">

<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:url" content="https://yoursite.com/page">

<meta property="og:type" content="website">

<meta property="og:site_name" content="Your Site Name">

Best Practices

Do:

- Use 1200x630px PNG or JPG

- Keep file size under 300KB (compress with Squoosh)

- Include your brand name/logo

- Use high contrast text (readable at small sizes)

- Test with Facebook Sharing Debugger

Don't:

- Use text-heavy images (gets cut off on mobile)

- Rely on OG image alone (always have og:title too)

- Use SVG (not supported by most platforms)

- Forget og:image:width and og:image:height

- Use HTTP URLs (must be HTTPS)

OG Image in Next.js

// app/layout.tsx

export const metadata = {

  openGraph: {

    images: [{

url: '/og-image.png',

width: 1200,

height: 630,

alt: 'Your Site Description',

    }],

  },

};

Dynamic OG Images

Generate OG images per page using @vercel/og:

// app/api/og/route.tsx

import { ImageResponse } from '@vercel/og';

export async function GET(request) {

return new ImageResponse(

    <div style={{ fontSize: 48, background: '#000', color: '#fff', width: '100%', height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>

Your Dynamic Title

    </div>,

    { width: 1200, height: 630 }

);

}

Checking Your OG Tags

[SEO Snapshot](/) checks:

- All 6 OG tags present

- og:image URL reachable (HEAD request)

- og:image completeness score

FAQ

**Q: Does og:image affect SEO?**

A: Not directly. But good OG images increase click-through from social media, which drives traffic.

**Q: Can I use a different image for Twitter?**

A: Yes. Add twitter:image separately. If not set, Twitter falls back to og:image.

**Q: What format should I use?**

A: PNG for graphics/text, JPG for photos. Keep under 300KB.