Social Media OpenGraph Banner Editor

What is an Og Image Editor?

The Open Graph image is the large picture that appears when your link is shared on LinkedIn, Facebook, X, Slack, Discord or WhatsApp. Posts with a clear, branded image get noticeably more clicks than links with no image or a random one. This editor lets you design a 1200 × 630 px share image in the browser and export it, no design software required.

How to use it

  1. Enter the headline and optional subtitle.
  2. Choose background colours or gradients and add your logo.
  3. Adjust layout and font sizes in the live preview.
  4. Export the PNG and reference it in your page's og:image meta tag.

Recommended specifications

  • Size: 1200 × 630 px (aspect ratio 1.91:1).
  • Format: PNG or JPG; keep the file under about 1 MB for fast fetching.
  • Safe area: keep text and logos away from the edges; some platforms crop to a square or 2:1 crop.
  • URL: an absolute HTTPS address.

Adding it to your page

<meta property='og:image' content='https://example.com/og/launch.png'>
<meta property='og:image:width' content='1200'>
<meta property='og:image:height' content='630'>
<meta name='twitter:card' content='summary_large_image'>

Design tips

  • Use a large headline of 5 to 8 words; previews are small on phones.
  • High contrast between text and background.
  • Consistent branding across pages builds recognition in feeds.
  • Do not repeat the page title verbatim if it already appears below the image in the preview card.
  • After publishing, refresh the cached preview with the Facebook Sharing Debugger or LinkedIn Post Inspector.

Frequently Asked Questions

What size should an Open Graph image be?

1200 by 630 pixels, which matches the 1.91 to 1 ratio used for large link previews.

Why is my new OG image not showing?

Platforms cache previews. Use the Facebook Sharing Debugger or LinkedIn Post Inspector to refetch the page.

Does Twitter/X use the og:image tag?

Yes. X falls back to Open Graph tags, but set twitter:card to summary_large_image for the large image layout.

Where should text be placed on the image?

Near the centre, away from the edges, because some platforms crop previews.

You May Also Need