# Open Graph Generator

> Build og:title, og:image, og:description and twitter:card tags and see a live share preview for Facebook, LinkedIn and X before you post the link.

Use it free at https://swipetolaunch.com/tools/open-graph-generator

## How to use it

1. **Fill in title and description.** Write them for people scrolling a feed, not for search.
2. **Paste the image URL.** An absolute https URL to a 1200x630 image. The preview loads it straight away.
3. **Pick the X card size.** Large image for most pages, small for profiles and docs.
4. **Copy the tags.** Paste them into the page's <head> and re-share the link.

## What Open Graph does

Open Graph is the set of `og:` meta tags Facebook introduced and almost every app now reads: LinkedIn, Slack, Discord, iMessage, WhatsApp and X. When someone pastes your link, the app fetches the page, reads these tags and draws a card. Without them it guesses, usually with the wrong image and a title pulled from your navigation.

## The tags you need

- **og:title** is the card headline. It can be punchier than your SEO title, since there is no keyword to match.
- **og:description** is one or two lines under it. Many apps show only the first line.
- **og:image** is the picture, and the part people actually notice. Use 1200x630 pixels (a 1.91:1 ratio), keep important text away from the edges, and stay under 5 MB.
- **og:url** is the canonical address, so shares of different variants count as one.
- **og:type** is `website` for most pages and `article` for blog posts.
- **twitter:card** picks the X layout. `summary_large_image` shows a big image; `summary` shows a square thumbnail.

X reads og:title, og:description and og:image when its own twitter: tags are missing, so you do not need to duplicate them.

## Why the preview might not match

Each app crops and styles cards differently and caches them for days. If you change the image after sharing, run the URL through the platform's own debugger (Facebook Sharing Debugger, LinkedIn Post Inspector) to refresh it. The image must be publicly reachable: images behind a login, on localhost or blocked by robots.txt will not load for the crawler.

## Make the image

No share image yet? The [OG image generator](/tools/og-image-generator) makes a clean 1200x630 card from a title and your logo. Once the page is live, confirm what crawlers see with the [Open Graph checker](/tools/open-graph-checker).

## What you get

- All core og: and twitter: tags
- Live Facebook / LinkedIn and X card previews
- Handles @names and x.com profile URLs
- Values escaped for safe HTML

## Questions

### What size should an Open Graph image be?

1200 by 630 pixels works across Facebook, LinkedIn, X and messaging apps. Keep the file under 5 MB, use JPG or PNG, and keep text inside the central area so crops do not cut it off.

### Do I need both Open Graph and Twitter tags?

You need Open Graph tags and twitter:card. X falls back to og:title, og:description and og:image, so separate twitter:title and twitter:image tags are optional.

### Why does my old image still show when I share?

Platforms cache link previews. Re-scrape the URL in Facebook's Sharing Debugger or LinkedIn's Post Inspector. X refreshes its cache on its own, usually within a day.

### Can og:image be a relative URL?

No. Use a full absolute URL starting with https://. Many crawlers do not resolve relative paths and will show no image.
