MicroTool
Submit a Tool
SEO Tools

Open Graph Generator

Open Graph tags are meta tags that tell Facebook, LinkedIn, WhatsApp and Slack what title, description and image to show when someone shares your link. Without them, platforms guess — often picking the wrong image or no image at all. Fill in the fields, check the live preview, and copy the tags into your page's head.

Runs entirely in your browser — nothing you type is uploaded.

The canonical URL of the page being shared.

Facebook cuts this around 88 characters.

Around 110 characters show on Facebook before truncation.

Absolute URL. 1200 × 630 crops cleanly everywhere.

Describes the image for screen readers.

Your site or brand name.

Describes what the page is.

Language and region of the content.

Add a page URL and title to generate the tags.

How to

How to use the Open Graph Generator

  1. 1

    Enter the page details

    Add the canonical URL, the title and the description you want shown when the link is shared.

  2. 2

    Add an image

    Paste an absolute image URL. 1200 × 630 pixels is the size every major platform crops cleanly.

  3. 3

    Check the preview

    The preview shows how the card appears and where each platform truncates your text.

  4. 4

    Copy the tags

    Paste them into the <head> of the page, then clear the cache with Facebook's Sharing Debugger.

Examples

Open Graph Generator examples

Blog post

Input
og:type article, title, description, 1200 × 630 image
Output
<meta property="og:image" content="https://…/cover.jpg" />

A large image card is the most clicked format on Facebook and LinkedIn. Anything under 600 px wide falls back to a small thumbnail.

Title with an ampersand

Input
Tom & Jerry <Best Moments>
Output
content="Tom &amp; Jerry &lt;Best Moments&gt;"

Ampersands and angle brackets must be escaped or the meta tag breaks the page's HTML. This is escaped for you.

Missing image

Input
Title and description only
Output
Valid tags, but a text-only share card

Platforms show a plain link without og:image, which draws far fewer clicks than a card with a picture.

Why use it

What the Open Graph Generator gives you

See the card before you publish

The preview shows the title, description and image as they appear in a feed, including where each platform cuts the text.

Escaping handled properly

Ampersands, angle brackets and quotes are escaped in the right order, so a title containing them cannot break your markup.

Image checks built in

The image is loaded and measured, so you find out it is the wrong size or unreachable here rather than after sharing.

Covers every major platform

Facebook, LinkedIn, WhatsApp, Slack, Discord and Pinterest all read Open Graph, so one set of tags serves all of them.

Runs in your browser

Nothing you type is uploaded, so you can prepare tags for a page that is not live yet.

Good to know

Open Graph Generator limitations

  • Platforms cache aggressively. After changing tags you must clear the cache in Facebook's Sharing Debugger or LinkedIn's Post Inspector, or the old card keeps appearing.
  • The image URL must be absolute and publicly reachable. Images behind a login or on localhost will not load for the crawler.
  • Each platform crops and truncates differently, so the preview is a close approximation rather than an exact copy.
  • X reads Open Graph as a fallback, but a dedicated Twitter card gives you more control there.

Summary

Open Graph Generator in short

  • Open Graph tags control the title, description and image shown when your link is shared.
  • 1200 × 630 pixels is the image size that crops cleanly on every major platform.
  • og:title, og:description, og:image and og:url are the four tags that matter most.
  • Platforms cache share cards, so clear the cache after changing tags.

FAQ

Open Graph Generator questions

What are Open Graph tags?

Open Graph is a set of meta tags, originally created by Facebook, that tell social platforms how to display your link. They set the headline, summary and image on the card people see in their feed.

What size should the Open Graph image be?

1200 × 630 pixels, a 1.91:1 ratio. That is what Facebook, LinkedIn and Slack crop cleanly. Below 600 px wide, platforms fall back to a small square thumbnail instead of a large card.

Why is my old image still showing after I changed it?

Platforms cache share cards, sometimes for weeks. Run the URL through Facebook's Sharing Debugger and click Scrape Again, or use LinkedIn's Post Inspector, to force a refresh.

Which Open Graph tags are actually required?

og:title, og:type, og:image and og:url are the four the specification lists as required. In practice og:description matters too, since it is the text under the headline on the card.

Is og:description the same as the meta description?

No. The meta description is for search results; og:description is for share cards. They can differ — a search description should answer a query, while a share description should make someone want to click in a feed.

Do I still need Twitter card tags?

X falls back to Open Graph when Twitter tags are absent, so a basic card works. Add Twitter tags when you want a different image or headline there, or to specify the card type.

Where do the tags go?

Inside the <head> element, ideally near the top. Tags placed in the body are ignored, and some crawlers only read the first portion of the document.

Can I use a relative image URL?

No. og:image and og:url must be absolute, including the protocol and domain. A crawler fetching your page from outside has no base to resolve a relative path against.

Do Open Graph tags help SEO?

Not directly — they are not a ranking factor. They improve how shared links look, which lifts click-through and referral traffic, and that indirect engagement is where the value sits.

Discover

Related SEO tools

Twitter Card GeneratorGenerate Twitter card meta tags for X and preview the card before you post. Supports summary and large image cards.Meta Title GeneratorGenerate SEO title tags from your keyword and see exactly where Google truncates each one, measured in pixels rather than characters.Meta Description GeneratorWrite meta descriptions that fit. Generate options from your keyword and see the pixel width Google actually truncates at.Schema GeneratorGenerate valid JSON-LD schema markup for articles, products, local business, events and more. Copy the code and paste it into your page.