What is an Open Graph image
The Open Graph image (also called og:image or "social card") is what shows up when someone shares your page link on Twitter, LinkedIn, WhatsApp, Slack, Discord or Telegram. It is the first visual impression outside your own site. Without it, your links look poor: plain text or a random thumbnail cropped badly.
Why it matters
Links with visual previews receive significantly more clicks than links without one. It is the difference between someone giving you a second look or scrolling past in their feed. For landing pages, blog posts, products and launches, the OG image is an essential marketing asset.
Correct size and format
- 1200x630 pixels: Facebook's official standard, valid almost everywhere.
- PNG or JPG: PNG for typography and sharp edges; JPG for photos.
- Under 1 MB: ideally under 300 KB. Slow platforms sometimes won't wait.
- Centered text: many platforms crop edges, especially on mobile.
Typography rules
Text needs to be readable at thumbnail size (when someone sees a tiny card in their mobile feed). That means: bold weight, minimum 60–80 px in the 1200x630 master, high contrast against the background. If your title is unreadable at 200x100 px, it does not work as an OG image. Cap it at two lines and resist cramming text in.
Layouts that work
- Big title on solid background: simple, high contrast, scalable. Most tech blogs do this.
- Title + subtitle + brand at the bottom: richer, still legible.
- Per-page generation: many sites generate OG dynamically with each article's title. Vercel and Cloudflare provide workers for this.
- Photo background template: works if the photo is great and contrast is preserved.
Validation and cache
After uploading, validate with Facebook Sharing Debugger and Twitter Card Validator. Both force a re-fetch and clear cache, important because og:image changes can take a long time to propagate. If you updated the image but still see the old one, that is cache: use the validators to force a refresh.
Final tips
Stay consistent with your brand. If you use specific colors on your site, use them in OG too. Consistency helps audiences recognize your content in saturated feeds. And measure: a good OG image can lift social CTR by up to 40%.