Skip to content
Guide

What Is an Open Graph Image — Your Link's First Impression

An Open Graph image is the 1200×630 preview card shown next to shared links. Here's how the og:image tag works, what it is not, and why 2026 made AI cards practical.

By Oginify10 min read
Analog collage of an open graph preview card on a phone screen

TL;DR

  • An Open Graph image is the 1200×630 preview image shown next to a shared link on X, LinkedIn, Slack, Discord, and iMessage, declared via the `<meta property="og:image">` tag in your page head.
  • It is one of the four required Open Graph properties (title, type, image, url) — and the only one that is a visual element, which makes it the single most consequential piece of share metadata you control.
  • The standard size is 1200×630 pixels at a 1.91:1 ratio, and anything narrower than 600px on the long edge degrades to a small thumbnail on most platforms.
  • Without an `og:image`, platforms fall back to guessing — a random page image, a grey placeholder, or a plain-text link — which measurably lowers the click appeal of every share.
  • In 2026, AI tools — URL-first generators like Oginify, or prompt-driven models like Gemini and GPT Image — made per-page, brand-matched cards practical for solo founders and small teams.

An Open Graph image is the preview card that appears next to your link whenever someone shares your URL on X, LinkedIn, Slack, Discord, WhatsApp, or iMessage. It is declared with the og:image meta tag in your page head, and it is the only one of the four required Open Graph properties that is a visual element — the piece of metadata that decides whether your shared link looks like a designed asset or a plain-text URL. In 2026, per-page Open Graph images stopped being a designer's luxury: AI generators now produce a brand-matched card from a URL in about thirty seconds, which means the practical answer to "what is an Open Graph image" has shifted from how to add a tag to why your card is now your cheapest brand surface.

The honest way to think about an Open Graph image is as the only visual that travels with your link. Titles and descriptions are text that every platform renders its own way, but the image is the one piece of your brand that appears, more or less unchanged, everywhere your URL is shared. Get it right and every share is a small piece of brand equity; get it wrong — or leave it missing — and every share is a small brand leak. The rest of this guide covers where the concept came from, how the mechanism works under the hood, what an Open Graph image is not, and why 2026 is the year the tooling finally caught up.

1. Where Open Graph came from

The Open Graph protocol was created by Facebook in 2010 to solve a specific problem: when a web page was shared on the social graph, the platform had no reliable way to know what that page actually was. A link to a movie page could render as a bare URL, a scraped snippet, or a random image, depending on the day and the crawler. Facebook's answer was a set of structured meta tags — og:title, og:type, og:image, og:url — that any web page could publish so that any platform could render it consistently. The protocol was released under the Open Web Foundation Agreement, and its specification at ogp.me remains the canonical reference today.

The four required properties are deliberately minimal: og:title names the page, og:type classifies it, og:url declares its canonical identity, and og:image supplies the visual, per the Open Graph protocol. Everything else — og:description, og:site_name, og:locale — is optional. What the protocol did not anticipate in 2010 was how much of the world's sharing would eventually flow through messaging apps like Slack, Discord, WhatsApp, and iMessage, which is exactly where the same four tags now do most of their work. A protocol designed for a social graph became the de facto standard for every link preview on the internet.

What matters for you is that the standard never got replaced. Sixteen years later, when someone drops your URL into a group chat, the crawler that fetches your page is still looking for the same og:image tag that Facebook's engineers specified in 2010. The protocol's longevity is precisely why investing in your Open Graph image is durable: the tag you publish today will be read by every platform that exists tomorrow.

2. What an Open Graph image actually is

An Open Graph image is the value of the og:image meta tag in your page head — an absolute, publicly accessible URL that tells social crawlers which image should represent your page when it is shared. The tag lives in the <head> of your HTML, and the content value must be a full HTTPS URL, because crawlers request the image directly rather than rendering your page:

<meta property="og:image" content="https://yourdomain.com/og-image.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="A summary of what the card shows" />

The recommended size is 1200×630 pixels at a 1.91:1 aspect ratio, which is the large-card size that X, LinkedIn, Slack, Discord, Facebook, and iMessage all render — the size the Oginify homepage ships by default. The Open Graph protocol also defines structured properties — og:image:secure_url, og:image:type, og:image:width, og:image:height, and og:image:alt — and the spec explicitly recommends supplying og:image:alt as an accessibility description.

What makes og:image distinct among the four required properties is that it is the only one that carries an actual asset. og:title and og:description are strings the platform re-typesets in its own font; og:type and og:url are invisible plumbing. But the image arrives at the platform as a finished visual — your typography, your palette, your logo, your composition — rendered more or less exactly as you designed it. That is why the Open Graph image is less like a meta tag and more like a miniature landing page that travels with every share.

3. How it works — from your page to their feed

When a link is shared, the platform's crawler fetches the page's HTML, reads the Open Graph tags in the head, and assembles a preview card from them. For the image, the crawler requests the URL in og:image, verifies it is publicly accessible, checks the declared dimensions, and caches it so subsequent shares render instantly. If og:image:width and og:image:height are present, the platform can decide immediately whether the image qualifies for the large-card layout or must fall back to a small thumbnail — which is why those two optional tags are worth including even though the spec lists them as optional.

The platform-specific behavior is where most of the practical detail lives. A 1200×630 image renders as the large card on every major platform, but different networks crop it differently: X and LinkedIn tend to use a slightly different crop than Facebook, and Slack and Discord display a compact horizontal card. Anything narrower than 600px on the long edge is treated as a small thumbnail rather than a large card. That is why the 1200×630 convention exists — it is the safe size that every major platform renders as a large card, not a minimum or a maximum.

Two failure modes explain most broken previews. First, if og:image is missing entirely, the platform falls back to guessing — scraping a random image from the page, showing a grey placeholder, or rendering a plain-text link, none of which you control. Second, if the image URL is relative, requires authentication, or has changed since the platform last cached it, the card silently degrades. The fix for both is the same: an absolute, stable, public HTTPS URL for every page that gets shared.

4. What an Open Graph image is not

It is worth being precise about the boundaries, because the neighboring concepts are easy to confuse. An Open Graph image is not your page's hero image: the hero image lives inside your HTML and renders for human visitors, but social crawlers only render what you declare in the meta tags. You can have a beautiful hero on your page and still ship a grey preview card, because the two are read by different systems.

It is also not the same as a Twitter Card image, though the two overlap. Twitter supports its own twitter:image tags for the X-specific 2:1 card, but if they are absent, X falls back to your Open Graph tags — which is why a single 1200×630 Open Graph image works everywhere without any Twitter-specific markup, as this OG image explainer notes. And it is not a favicon or an app icon: those are small, always-present identity marks, whereas the Open Graph image is a large, share-specific canvas that carries a headline, a message, and a composition.

The distinction that matters most is this: the Open Graph image is not a technical checkbox. It is a brand surface. Treating it as a one-time setup task — "we added the tag, we're done" — is exactly what produces the site-wide logo card that tells every reader "this is a template, not a page." The sites that get value from their Open Graph images treat each one as a miniature design brief for that specific URL.

5. Why 2026 changed the game

For most of the protocol's life, the practical barrier to good Open Graph images was not the tag — it was the design work. A blog with forty posts needed forty distinct, on-brand cards, and that required either a designer, a template system, or a spreadsheet of manually exported images. Most teams solved it by shipping one static site-wide card, which is why the internet is full of identical logo cards. That trade-off is what 2026 changed.

The change is AI generation, which split into two workflows. Prompt-driven models — Gemini, GPT Image, Midjourney — can paint a beautiful card from a description, but leave you to specify the 1200×630 ratio, render the text legibly, export, host, and write the tags yourself. URL-first generators like Oginify collapse that to a single step: paste a URL, and the tool reads your page's brand, palette, and headline and produces four 1200×630 variants — one on-brand and three creative wildcards — in about thirty seconds, no prompt and no template picker, exactly the flow the Oginify homepage runs. The same engine is available as an MIT-licensed open-source Agent Skill for teams that want to run it in their own pipeline.

The consequence is that per-page Open Graph images are now a realistic default rather than a stretch goal. A solo founder can give every product page its own card in an afternoon; a content team can backfill old posts that shipped without any image. The mechanism of the protocol has not changed — it is still the same og:image tag — but the economics of filling it well have collapsed. If you have been treating your Open Graph image as a one-time setup, 2026 is the year to reconsider: the tooling now exists to make every card you ship a deliberate one.

One practical note closes the loop: after you publish a card, verify it before you trust it. Social platforms cache Open Graph metadata aggressively, so a changed tag may not appear immediately — use the platform's own debugger, or a tool like Oginify's validator, to confirm the crawler sees exactly what you intend. The cache is also why the first card you ship matters: a grey placeholder that has been shared for months has built up real impressions, and replacing it is a small but visible brand win. For the full ranked comparison of the tools that do this — from URL-first generators to prompt-driven models to code-driven options like Vercel OG — see our best AI open graph image generators guide.

Conclusion

An Open Graph image is the 1200×630 visual that travels with your link on every platform that reads the Open Graph protocol — X, LinkedIn, Slack, Discord, WhatsApp, and iMessage. It is the only one of the four required meta tags that carries an actual asset, which makes it the single most controllable piece of your brand's shared presence. For sixteen years the protocol has been stable, and in 2026 the design bottleneck finally broke: AI tools now produce brand-matched per-page cards from a URL in seconds. The question is no longer whether you can afford good cards — it is whether you will stop shipping grey placeholders.

Paste your URL into Oginify and you will have four on-brand card variants in about thirty seconds — no signup required for the free daily quota. Before you publish, run your existing tags through the Open Graph validator to see exactly what your links look like today, and the card gallery shows what a single URL produces across page types.

Frequently Asked Questions

Definition, sizing and setup questions about Open Graph images.

Do I still need og:image if my page already has a hero image?

Yes. Hero images live inside your HTML and render for human visitors; social crawlers only render what you declare in `<meta property="og:image">`. Without the tag, X falls back to a plain link, LinkedIn shows a domain snippet, and Slack renders a grey placeholder — regardless of how good the hero looks on the actual page.

What is the difference between og:image and twitter:image?

`og:image` is the Open Graph property read by X, LinkedIn, Slack, Discord, and iMessage. `twitter:image` is a Twitter-specific tag for the 2:1 card. If `twitter:image` is absent, X falls back to your `og:image` tags — so a single 1200×630 Open Graph image works everywhere without Twitter-specific markup.

What happens if I do not set an Open Graph image?

Platforms fall back to guessing: scraping a random image from the page, showing a grey placeholder, or rendering a plain-text link. None of those are under your control, and each one lowers the click appeal of every share. Setting a deliberate `og:image` is the difference between a designed card and a degraded link.

Can AI really make an Open Graph image that matches my brand?

Yes, and this is what changed in 2026. URL-first generators like Oginify read your live page — actual logo, palette, headline, and tone — and produce four brand-matched 1200×630 variants without a prompt. Prompt-driven models like Gemini and GPT Image can also paint one, but you must specify the ratio, verify text rendering, export, host, and write the tags yourself.

Is the Open Graph protocol still relevant in 2026?

More than ever. The protocol from 2010 is now the de facto standard for every link preview, and messaging apps — Slack, Discord, WhatsApp, iMessage — rely on the same four tags that Facebook specified. Investing in your Open Graph image is durable because the tag you publish today will be read by every platform that exists tomorrow.

What size should my Open Graph image be?

1200×630 pixels at a 1.91:1 aspect ratio is the large-card size that every major platform renders. Anything narrower than 600px on the long edge degrades to a small thumbnail. Export at exactly these dimensions, supply `og:image:width` and `og:image:height`, and add an `og:image:alt` description for accessibility.

Stop Browsing, Start Shipping

The cards you've been browsing on this hub were all painted the same way — one URL, four variants, no template picker in the middle.