OGFreeOGImageOpen editor
← All posts

Facebook link preview image size and Open Graph tags (2026)

· facebook, open graph, social sharing

Share a link on Facebook and the preview is the first thing people see, often before they read a single word of your post. Get the image right and the link looks like a real product, an article worth clicking, a launch worth caring about. Get it wrong and you get a tiny thumbnail, a stretched logo, or nothing at all. The good news: Facebook does not use any special Facebook-only image tags. It reads the same standard Open Graph (og:) tags every other platform uses, so one well-sized image and a handful of meta tags cover it. This is the Facebook-specific guide: the exact size, the tags that matter, how Facebook caches, and how to fix a broken preview.

The Facebook link preview image size

The number to design for is 1200x630, a 1.91:1 landscape rectangle. That is Facebook's recommended Open Graph image size, and it is the same size Slack, Discord, WhatsApp, and iMessage expect, which is exactly why a single image works almost everywhere.

A few size rules worth knowing:

  • Recommended: 1200x630 (1.91:1). This fills Facebook's large link card cleanly with no cropping.
  • Minimum for a large card: roughly 600x315. Below that, Facebook may drop to a small square thumbnail next to the text instead of the big image. Always aim well above the minimum.
  • Stay under 5 MB. Oversized images can be skipped or fail to scrape. A 1200x630 PNG or JPG should be a few hundred KB.

If you export from FreeOGImage, images render at 2x, so a 1200x630 design comes out at 2400x1260 and stays crisp on high-density screens. For the dimensions on every other platform, see the OG image size cheat sheet.

Facebook reads standard og: tags (not Facebook-specific ones)

This trips people up: there is no fb:image or facebook:image tag. Facebook's crawler reads the standard Open Graph protocol. These are the tags it looks for:

<meta property="og:title" content="Your page or product title" />
<meta property="og:description" content="One short, compelling sentence." />
<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 property="og:url" content="https://example.com/your-page" />
<meta property="og:type" content="website" />

A few notes specific to Facebook:

  • og:image must be an absolute https:// URL. A relative path like /og/launch.png means nothing to the crawler because it does not run in the context of your page. This is the single most common reason a Facebook preview shows up blank.
  • og:image:width and og:image:height help. Declaring the dimensions lets Facebook render the large card immediately on the first scrape instead of waiting until it has downloaded and measured the image. Without them, the first share can briefly fall back to a small thumbnail.
  • fb:app_id is optional. It is only needed if you use Facebook Insights or domain-level analytics, not to make a preview work.

Why Facebook previews break

Most failures come from the same short list. Each one is quick to fix once you spot it.

| Symptom | Likely cause | Fix | | --- | --- | --- | | Blank or no image | No og:image, or it is a relative URL | Add an absolute https:// og:image | | Small square thumbnail | Image below ~600x315, or width/height not declared | Use 1200x630 and add og:image:width/height | | Old image still showing | Facebook cached the first scrape | Use the Sharing Debugger to "Scrape Again" | | Image broken / missing | og:image is auth-gated, behind a login, expired signed URL, or blocked in robots.txt | Make the image publicly fetchable by an anonymous request | | Wrong shape, cropped | Square or portrait image forced into the wide card | Design at 1.91:1 (1200x630) |

The two that catch experienced people most often are the relative URL and caching. If your tags look correct but the preview is still wrong, the issue is almost always one of those two. For a deeper, platform-agnostic walkthrough of every failure mode, see why your link preview looks broken.

The auth-gated image trap

If your og:image lives behind a login, a private CDN bucket, a signed URL that expires, or a bot-blocking robots.txt rule, Facebook's crawler gets a 403 or 404 and shows nothing. Test it the way the crawler sees it: open the image URL in a private or incognito window with no cookies. If you cannot load it there, neither can Facebook.

How Facebook caches (and why your fix "did nothing")

Facebook does not re-fetch your tags every time someone shares the link. It scrapes a URL once, stores what it found, and serves that cached version to everyone for a long time. So when you fix og:image and share again, Facebook keeps showing the old preview because it is reading its cache, not your updated page.

This is why a "broken" preview often is not broken anymore. You already fixed it; you are just looking at a stale snapshot. The only way to update it is to force Facebook to scrape the URL again.

Force a re-scrape with the Sharing Debugger

The Facebook Sharing Debugger is the official tool for this. It shows you exactly what Facebook's crawler sees and lets you refresh the cache:

  1. Open the Facebook Sharing Debugger (developers.facebook.com/tools/debug).
  2. Paste the full URL of your page.
  3. Click Scrape Again to force a fresh fetch. This replaces the cached preview with the current tags.
  4. Read the results: it lists the og: values it found and flags warnings like "image too small," a missing og:image, a redirect chain, or an unreachable URL. Those warnings usually point straight at the real problem.

A useful habit: after editing your tags, run Scrape Again twice. The first pass refreshes the cache; the second confirms the new image, title, and description are what Facebook now stores. You can also rename the image (for example launch-v2.png) to sidestep any image-level caching entirely.

If you want to check your tags before they ever touch Facebook, preview and validate your tags first, so you only re-scrape once everything is already correct.

Square fallback behavior

Facebook strongly prefers the wide 1.91:1 card, but it does not always get one. Here is what happens with other shapes:

  • Landscape 1200x630 (1.91:1): the full-width large card. This is what you want.
  • Square 1080x1080 (1:1): Facebook may show it as a smaller square image beside the text rather than the big banner. A square can be a deliberate choice for some feeds, but for a standard shared link it usually reads as smaller and less prominent.
  • Too-small or oddly shaped images: Facebook falls back to a compact thumbnail, and your carefully made design gets shrunk into a corner.

The practical takeaway: design for the wide landscape frame, keep your headline and logo centered away from the edges, and you avoid both cropping and the square-fallback shrink.

The Facebook fix checklist

Run through this in order:

  1. og:image exists in the raw HTML source (view source, not the rendered DOM).
  2. The URL is absolute (https://yourdomain.com/...), never relative.
  3. The image is publicly accessible with no login, expiring token, or robots.txt block. Verify in incognito.
  4. The size is right (1200x630, 1.91:1) and the file is under 5 MB, PNG or JPG.
  5. og:image:width and og:image:height are declared so the large card renders on first scrape.
  6. You ran the Sharing Debugger and clicked Scrape Again to clear the cache.

Tick all six and your Facebook preview will be the big, clean card you designed, every time someone shares the link.

Make a Facebook-ready image in the editor

You do not need design software to ship a sharp 1200x630 share image. FreeOGImage runs entirely in your browser: no signup, no watermark, and nothing is uploaded to a server.

  1. Open the editor with the product launch template.
  2. Add your badge, title, subtitle, and optional product image, keeping the important content centered.
  3. Keep the standard 1200x630 landscape size so it fills Facebook's wide card.
  4. Export the PNG (it comes out at 2x for sharpness), host it at a public HTTPS URL, and point og:image at that absolute address.

Prefer to start from a layout? Browse templates to compare looks, or read more guides on the blog.

A strong Facebook preview is one well-sized image, the standard og: tags with an absolute URL, and a re-scrape after any change. Set it up once and every link you post will look like it belongs. Open the editor and make yours now.

Product Launch template preview

Make your own with the Product Launch template — free, private, no signup.

Open the editor