OG Image Best Practices for 2026

Open Graph images are the single biggest factor in whether someone clicks your link on social media. A good OG image can increase click-through rates by 2-3x. Here's what works in 2026.

The basics

Open Graph images appear when your URL is shared on Twitter/X, Facebook, LinkedIn, Slack, Discord, iMessage, and dozens of other platforms.

The og:image meta tag tells platforms which image to show:

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

Recommended size: 1200 x 630

This is the universal standard. Twitter, Facebook, and LinkedIn all render this well. Avoid other sizes — they'll get cropped unpredictably.

| Platform | Display | Notes | |----------|---------|-------| | Twitter/X | 1.91:1 ratio | 1200x630 is perfect | | Facebook | 1.91:1 ratio | Same as Twitter | | LinkedIn | 1.91:1 ratio | Same aspect ratio | | Slack | Variable | Shows full image | | Discord | Variable | Shows full image |

Format: PNG over JPEG

PNG gives you sharper text and cleaner gradients. JPEG introduces compression artifacts, especially around text — which is exactly what OG images contain. The file size difference is negligible for a single image.

SVG is not supported by any social platform as an OG image format.

Common mistakes

1. No OG image at all

The default preview for a link without an OG image is a gray box or a random screenshot. This kills click-through rates.

2. Using a screenshot of the page

Screenshots are low-contrast, hard to read at thumbnail size, and look generic. Purpose-built OG images with large text always outperform.

3. Text too small

The title should be readable at 300px wide (roughly how it appears in a Twitter feed). Use 48-64px font size minimum for the title.

4. Too much text

Keep it to a title and one line of description. Anything more gets illegible at social media thumbnail sizes.

5. Stale images

Social platforms cache OG images aggressively. If you update an image, you may need to use their cache-clearing tools:

• Twitter: Card Validator
• Facebook: Sharing Debugger
• LinkedIn: Post Inspector

Automating OG images

The best approach is to generate OG images programmatically so every page gets one automatically. Options:

1. SnapOG API — send title + template, get a PNG back. One API call per page. Try it free.
2. Satori + resvg — build your own renderer (this is what SnapOG uses under the hood)
3. Puppeteer/Playwright — screenshot an HTML page. Slow and resource-heavy.

For most teams, an API is the fastest path to having OG images on every page without maintaining image generation infrastructure.