OG Image Best Practices: The Complete Guide to Social Share Images

Your OG image is the first thing people see when your link gets shared. Here's how to design social share images that actually get clicks.

By Sharon Onyinye

OG Image Best Practices: The Complete Guide to Social Share Images

Every time someone shares a link on Twitter, LinkedIn, Facebook, or Slack, the first thing that loads is the OG image. It's the visual handshake before anyone reads a single word.

And most people get it wrong.

A bad OG image — or worse, no OG image at all — kills click-through rates. A generic placeholder screams "I didn't bother." A blurry, poorly cropped preview says "this probably isn't worth your time."

Here's how to make sure your OG images do the opposite.

What Is an OG Image and Why Does It Matter?

OG stands for Open Graph, a protocol Facebook introduced in 2010 that lets you control how your content appears when shared on social platforms. The OG image is the preview thumbnail that gets attached to your link.

When someone pastes your URL into a tweet, a LinkedIn post, or a Slack channel, the platform fetches your OG metadata and renders a card. That card includes three things:

  • og:title — The headline
  • og:description — A short summary
  • og:image — The preview image

The image takes up roughly 70-80% of the card's visual real estate. It's the single biggest factor in whether someone clicks or scrolls past.

Numbers back this up. Posts with well-designed images get 2-3x more engagement than text-only posts. And since OG images show up automatically every time your link is shared, getting them right creates a compounding return. Every share becomes a mini billboard.

Design Best Practices That Actually Work

Contrast Is Everything

Your OG image will appear in different contexts — light mode, dark mode, crowded timelines, Slack threads. If it doesn't pop against varying backgrounds, it disappears.

Rules to follow:

  • Use bold background colors or gradients that stand out
  • Ensure text has strong contrast against the background (WCAG AA minimum)
  • Avoid placing text near edges where platforms might crop
  • Test your image against both light and dark backgrounds

Text Size and Readability

OG images render at different sizes across platforms. What looks great at 1200px wide might be unreadable when Twitter crops it to a thumbnail.

Keep text handling tight:

  • Limit to 5-7 words maximum for headlines
  • Use a font size equivalent to at least 48px at full resolution
  • Stick to one or two font weights — don't get fancy
  • Leave generous padding around text (at least 60px from edges)

Branding Without Overdoing It

Your OG image should be recognizable as yours, but branding shouldn't dominate. The goal is to communicate value, not run a logo ad.

A good approach:

  • Small logo in a consistent corner (bottom-right works well)
  • Use your brand colors as the palette
  • Maintain consistent typography across all OG images
  • Create a template so every page's OG image feels cohesive

Show, Don't Just Tell

The best OG images include a visual preview of what's behind the link. For SaaS products, this means a screenshot or mockup. For blog posts, it might be an illustration that hints at the topic.

Avoid generic stock photos. A screenshot of your actual product in a clean device frame tells people exactly what they'll find when they click. A social card generator can help you create these product-focused OG images quickly and consistently.

How OG Images Differ by Platform

Not every platform treats OG images the same way. Understanding the differences prevents awkward surprises.

Twitter/X:
  • Displays images at approximately 1.91:1 ratio
  • Large cards render at roughly 1200 x 628 pixels
  • Crops images that don't match — center crop by default
  • Summary cards with large images get more engagement than small card formats
  • Use a Twitter card generator to create images at the exact right dimensions
LinkedIn:
  • Uses 1200 x 627 pixels for link previews
  • Adds a slight overlay/shadow to images
  • Professional audience means cleaner designs perform better
  • Text-heavy OG images can actually work well here
Facebook:
  • Standard OG image size is 1200 x 630 pixels
  • Messenger shares render at a smaller scale
  • Images smaller than 600 x 315 get shown as tiny thumbnails — avoid this
Discord and Slack:
  • Both pull from og:image tags
  • Discord renders larger previews than Slack
  • Slack often compresses images — use high contrast to survive compression
  • Both support animated images, but static is safer

For exact pixel dimensions per platform, check out the OG Image Size Guide.

The Quick Way to Create OG Images

You have two options: spend 30 minutes in Figma for every page, or use a purpose-built tool.

With Screenhance, the workflow looks like this:

  • Upload a screenshot of your page or product
  • Pick a device frame and background
  • Add minimal text if needed
  • Export at OG-ready dimensions

That's it. Five minutes, no design skills needed. The result looks polished and professional across every platform.

The key is consistency. Once you have a template you like, every new page or blog post gets the same treatment. Your brand starts to become recognizable in people's feeds.

Frequently Asked Questions

What size should an OG image be?

The standard OG image size is 1200 x 630 pixels, which works across most platforms. Twitter uses a slightly different ratio (1200 x 628), and LinkedIn uses 1200 x 627, but 1200 x 630 is the safe universal choice. Always export at high quality — platforms will compress it for you.

Do OG images affect SEO?

OG images don't directly affect search engine rankings, but they significantly impact click-through rates from social media. Higher engagement and more traffic from social shares can indirectly boost your SEO. Google also sometimes uses OG images in search results and Google Discover.

What happens if I don't set an OG image?

If you don't specify an OG image, platforms will try to find one on their own — usually grabbing the first image on the page. This often results in a logo, an icon, or a completely irrelevant image. Some platforms will show no image at all, which dramatically reduces engagement.

Related Reading

Conclusion

OG images are low-effort, high-impact. You set them once per page, and they work for you every time that link gets shared.

The formula is simple: strong contrast, readable text, consistent branding, and the right dimensions. Nail those four things and your links will stop getting ignored in crowded feeds.

Don't leave your social previews to chance. Control the image, control the click.

Ready to create stunning mockups?

Try Screenhance free - no credit card required.

Start Creating Free