Free SEO Tool

Free Open Graph Generator

Build your Open Graph and Twitter Card meta tags, see an Open Graph preview of how the link will actually look, and catch the image size problems before you ship. No sign-up required.

Page URL

Title

0 of about 60 characters before truncation

Description

0 of about 155 characters before truncation

Image URL

Absolute URL. Recommended size 1200 by 630 pixels.

Site name

X / Twitter handle

Type:

Card:

Good cards get the click. Something still has to earn the impression.

RankSpot researches, writes and publishes SEO articles that rank, each one shipped with its metadata already set. No tags to paste by hand.

Try RankSpot free

How your link will look

Facebook and LinkedIn

example.com

Your title appears here

Your description appears here.

X / Twitter

Your title appears here

Your description appears here.

example.com

Your Open Graph meta tags

<!-- Open Graph / Facebook / LinkedIn -->
<meta property="og:type" content="website" />

<!-- Twitter / X -->
<meta name="twitter:card" content="summary_large_image" />

Paste these into the <head> of your page, then re-scrape the URL in the Facebook Sharing Debugger to clear the old cached card.

How to use the Open Graph generator

1. Fill in your page details

Add the URL, title, description and image you want shown when the page is shared.

2. Check the live preview

See how the card renders on Facebook, LinkedIn and X, with a warning if your image is too small or the wrong shape.

3. Copy the tags

Paste the generated meta tags into the head of your page, then re-scrape the URL to clear the cached card.

What are Open Graph meta tags?

Open Graph meta tags are lines in the head of your page that tell social platforms how to display it when someone shares the link. Facebook created the protocol in 2010, and it is now read by LinkedIn, WhatsApp, Slack, Discord, iMessage and most other software that unfurls a URL.

Worth being direct about what they do and do not affect: Open Graph tags are not a Google ranking factor. They change how your link looks once it is shared, which moves click-through rate and referral traffic, not your position in the search results.

Without them, platforms guess. They scrape whatever image and text they can find, which usually means a logo, an icon, or the first sentence of your cookie banner. A deliberate card is one of the cheapest conversion wins available on any page.

The Open Graph tags that matter

There are dozens in the spec. These are the ones that change what people see.

Tag	Needed	What it does
`og:title`	Yes	The headline shown on the card. Cut off around 60 characters on most networks.
`og:description`	Recommended	One or two sentences under the title. Truncated around 155 characters.
`og:image`	Yes	Absolute URL to the card image. Relative paths are ignored by every scraper.
`og:url`	Recommended	The canonical URL of the page, so shares of tracked variants consolidate.
`og:type`	Recommended	What the page is. website for most pages, article for blog posts.
`og:site_name`	Optional	Your brand name, shown alongside the domain on some networks.
`twitter:card`	Recommended	summary_large_image for a full-width image, summary for a small thumbnail.

Open Graph image size guide

One 1200 by 630 file covers every major network. The exceptions are worth knowing.

Where	Size in pixels	Notes
Facebook and LinkedIn	1200 x 630	The 1.91:1 standard. Anything smaller than 600 x 315 renders as a small thumbnail instead of a full card.
X (Twitter) large card	1200 x 628	Effectively the same 1.91:1 image. One file covers both networks.
X (Twitter) summary card	144 x 144 minimum	Square, cropped to 1:1. Only used when twitter:card is set to summary.
Safe minimum	600 x 315	Below this, Facebook drops to the small thumbnail layout and the card loses most of its impact.

Why your card still shows the old image

This is the most common complaint about Open Graph tags, and it is almost never a markup problem. Platforms cache aggressively. Once Facebook has scraped a URL it keeps that card, so fixing your tags changes nothing until you force a re-scrape in the Sharing Debugger.

When the tags genuinely are not being read, it is usually one of four things: they are in the body rather than the head, they use name where og values require property, the og:image is a relative path rather than an absolute URL, or the image sits behind authentication so the scraper gets a 403 where you see a picture.

The generator above rules out the second and third by construction and checks the fourth by loading your image the same way a scraper would.

Frequently asked questions

What is an Open Graph meta tag?

An Open Graph meta tag is a line in the head of your HTML that tells social networks how to display your page when someone shares it. Tags look like <meta property="og:title" content="Your headline" />. The protocol was created by Facebook in 2010 and is now read by LinkedIn, WhatsApp, Slack, Discord, iMessage and most other platforms that unfurl links.

What does OG mean in SEO?

OG stands for Open Graph, the protocol behind those og: prefixed meta tags. It is worth being precise about its role: Open Graph tags are not a Google ranking factor and do not affect your position in search results. They control how your page looks when shared on social platforms, which affects click-through rate and referral traffic rather than rankings.

What is an Open Graph used for?

It controls the card that appears when your link is shared: the image, headline, description and site name. Without it, platforms guess by scraping whatever they can find, which usually means a random image from the page and the first text they encounter. A deliberate card gets meaningfully more clicks than a guessed one.

Can you give me an example of an Open Graph?

A minimal set looks like this: <meta property="og:title" content="Free Open Graph Generator" />, <meta property="og:description" content="Build and preview og tags." />, <meta property="og:image" content="https://example.com/og.png" />, <meta property="og:url" content="https://example.com/tool" />, <meta property="og:type" content="website" />. The generator above produces all of these plus the Twitter equivalents.

Can you give me an example of a meta tag?

Meta tags are elements in the head of a page carrying information about it rather than visible content. A standard description tag reads <meta name="description" content="A summary of the page." />. Open Graph tags use property rather than name, as in <meta property="og:title" content="Your headline" />. The distinction matters, since some scrapers ignore og tags written with name.

How to generate meta tags?

Enter your page URL, title, description and image in the generator above. It assembles the Open Graph and Twitter Card tags, escapes anything that would break the markup, and shows a live preview of the result. Copy the block and paste it inside the head element of your page, before the closing head tag.

What is a meta tag generator?

A meta tag generator is a tool that writes the meta tag markup for you from plain inputs, so you do not have to remember which properties exist or how they are spelled. A good one also validates as it goes: this generator flags titles that will truncate, images that are too small, and relative image URLs that scrapers ignore.

Which tag generator is the best?

The useful test is whether it validates rather than just concatenates. Most generators will happily produce a tag with an unescaped quote in the title or a 400 pixel wide image, both of which break the card in ways you only discover after sharing. This one escapes attribute values, checks the real dimensions of your image URL, and previews both card layouts before you ship.

Is Open Graph free?

Yes. Open Graph is an open protocol, not a product. Adding the tags to your site costs nothing beyond the time to write them, and no platform charges to read them. This generator is free too, with no sign-up, and runs entirely in your browser.

What size should my OG image be?

1200 by 630 pixels is the standard, an aspect ratio of roughly 1.91:1. That size covers Facebook, LinkedIn and X with one file. Do not go below 600 by 315, because Facebook switches to a small thumbnail layout underneath that and the card loses most of its visual weight. Keep the file under about 5MB and use PNG or JPG.

Is 1080x1350 an aspect ratio?

No, 1080 by 1350 is a pixel dimension. Its aspect ratio is 4:5, the portrait format Instagram feed posts use. That shape is wrong for Open Graph cards, which crop to roughly 1.91:1 landscape, so a 4:5 image would have its top and bottom cut off. Use 1200 by 630 for og:image and keep 1080 by 1350 for Instagram.

Does 1080x1350 work for Facebook?

It works for a Facebook feed post where you upload the image directly, since that supports portrait. It does not work well as an og:image for a shared link, because link cards crop to a landscape ratio and most of a portrait image gets cut. If the same asset has to do both jobs, keep the important content within a centred 1.91:1 area.

How can I create an Open Graph image?

Design a 1200 by 630 canvas in any tool you already use, then keep the text large and centred, because the card renders small on mobile and the edges can crop. Many sites generate these automatically at build time from the page title. Whichever route you take, host the file at a stable absolute URL, because scrapers cache aggressively.

How to make an Open Graph image?

Start from a 1200 by 630 template, put the headline in type large enough to read at thumbnail size, add your logo, and export as PNG or JPG. Avoid small print and anything near the edges. Then set the absolute URL of that file as og:image and confirm it loads in a private window, since an image behind authentication will not load for the scraper.

How to check Open Graph tags?

Paste your URL into a validator such as the Facebook Sharing Debugger, LinkedIn Post Inspector or X Card Validator, each of which shows what that platform sees. To audit tags already published on a page rather than build new ones, use our metadata checker, which reads the live tags from any URL.

How to check Open Graph image?

Enter the image URL in the generator above and it reports the real pixel dimensions and warns if the size or aspect ratio will cause cropping. To verify what a platform has cached for a page you already published, run the URL through the Facebook Sharing Debugger and use its re-scrape option.

Is there a Facebook Open Graph debugger available?

Yes. Facebook's Sharing Debugger at developers.facebook.com/tools/debug shows exactly which tags Facebook read, flags problems, and lets you force a re-scrape. That re-scrape matters: Facebook caches aggressively, so after fixing your tags the old card will keep appearing until you clear it.

How to fix Open Graph tags?

Work through four causes in order. Check the tags are in the head element, not the body. Check they use property rather than name for og values. Check og:image is an absolute URL on a publicly reachable host. Then re-scrape in the Sharing Debugger, because a cached card will keep showing the old version even after the markup is correct.

How to view meta tags?

Open the page, view source, and look inside the head element, or open developer tools and inspect the head. For a readable summary rather than raw markup, our metadata checker extracts the title, description, canonical, robots and Open Graph tags from any URL and lays them out for you.

Is there a free graph maker available?

This question usually reaches Open Graph pages by accident, since a graph maker means a chart tool. If you meant charts, this is not that. If you meant a free Open Graph tag maker, the generator above does exactly that: enter your details, preview the card and copy the tags, with no account required.

Start free today

Millions of people will ask AI about your category this week

RankSpot researches, writes and publishes daily, and sends you the short list of what's left. Free for 3 days.

Start free trial