Free Generator

OG Image Maker

Free 1200×630 Open Graph image generator

Converge Converge Team
•

An Open Graph image (OG image) is the preview picture that appears when your link is shared on X, Facebook, LinkedIn, Slack, Discord, WhatsApp, or iMessage. It is the first thing people see before they decide whether to click, so it does a lot of the work your headline can't.

The safe universal size is 1200×630 pixels — a 1.91:1 ratio that renders without cropping on every major platform. Keep the file under each service's limit (5MB on X and LinkedIn, 8MB on Facebook) and aim for 200–500KB so the preview loads instantly. PNG suits graphics with text, JPEG suits photos, and WebP gives you both at a smaller size on platforms that support it.

This tool runs entirely in your browser. Pick a platform preset, type your title and subtitle, drop in a logo, choose a background (solid color, gradient, or your own image), and download as PNG, JPEG, or WebP. Your settings save to local storage so you can iterate across sessions — nothing is uploaded anywhere.

What size should an OG image be for each platform?

Every major platform reads the same og:image tag, so one 1200×630 image works everywhere — but each service crops and compresses it differently. These are the dimensions and file-size limits behind each preset in this tool:

PlatformDimensionsMax file sizeNotes
Facebook1200×6308 MB1.91:1 — the reference size
X (Twitter)1200×6285 MBNeeds twitter:card = summary_large_image
LinkedIn1200×6275 MBCaches hard — re-scrape after edits
Discord1200×6308 MBReads og:image directly
Slack1200×630—Unfurls from og:image + og:title
WhatsApp1200×630~300 KBDrops the preview if the file is too big
Threads1200×6008 MBSlightly shorter crop
Telegram640×360+5 MBPulls og:image; scales down cleanly

When in doubt, export at 1200×630. These presets only nudge the aspect ratio, and the same artwork survives every crop as long as you keep important text out of the outer 5% edge.

What Open Graph meta tags do you need?

Four tags cover almost every platform: og:image, og:image:width, og:image:height, and og:title. Add them inside your page's <head>, and always point og:image at an absolute https URL — relative paths break in every scraper.

<meta property="og:image" content="https://yoursite.com/og.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="Describe the image" />
<meta name="twitter:card" content="summary_large_image" />

Declaring width and height lets platforms reserve the right space instead of reflowing when the image loads. The twitter:card line tells X to render the large 1200×628 card rather than a small square thumbnail. After publishing, re-scrape with each platform's debugger so the fresh preview replaces any cached version.

How to Use This Generator

  1. Pick a size: use one of the platform presets (Twitter, Facebook, LinkedIn, Discord, Threads, Telegram) or enter custom dimensions.
  2. Set the background: solid color, one of 8 gradient presets, custom gradient with direction picker, or upload your own image.
  3. Add your text: title and optional subtitle. Pick fonts, sizes, colors (solid or gradient), and shadows.
  4. Add your logo (optional): upload PNG/SVG/JPG, scale it, position it relative to the text (above, left, or right).
  5. Polish with overlays and borders: dot patterns, grid, lines, drop shadows, or framed borders.
  6. Export: click Download to save as PNG, JPEG, or WebP. Click Copy to put the image directly on your clipboard.

Pro Tips

  • Test before publishing: drop your URL into opengraph.xyz, Facebook's Sharing Debugger, or Twitter Card Validator. Cache stale OG images aggressively, so refresh after each change.
  • Keep titles short: Twitter and Slack truncate around 60-70 characters. Facebook and LinkedIn allow more, but the first 4-5 words do most of the work.
  • High contrast wins: social feeds compress images aggressively. Light text on a dark gradient or dark text on a bright background reads better than subtle two-tone designs.
  • Use absolute URLs: always reference OG images with the full https://yoursite.com/path.png URL. Relative paths break in scrapers.
  • Set width and height in meta: add og:image:width and og:image:height tags so platforms reserve the right space and don't stretch the image.

Frequently Asked Questions

What is an OG image?
An OG (Open Graph) image is the preview image that appears when you share a link on social media platforms like Twitter/X, Facebook, LinkedIn, Discord, and Threads. It's defined using the og:image meta tag in your HTML.
Where do OG images appear?
OG images show up in link previews on social media feeds, messaging apps (Slack, Discord, iMessage), and search engine results. They're the first visual impression people get of your content before clicking.
What size should my OG image be?
Use 1200×630 pixels (a 1.91:1 ratio) — it renders without cropping on Facebook, LinkedIn, Discord, Slack, and WhatsApp. X/Twitter uses 1200×628 and Threads 1200×600, both close enough that the same artwork works. Keep the file under 5MB (WhatsApp prefers ~300KB); 200–500KB loads fastest.
How do I add an OG image to my website?
Add these tags inside your HTML : , plus og:image:width (1200), og:image:height (630), og:title, and og:description. Always use absolute https URLs, not relative paths, or scrapers will fail to load the image.
Why does my Twitter/X preview show a small square instead of a big card?
X only renders the large 1200×628 preview when you add . Without it, X falls back to the small square thumbnail. Add the tag, then re-check the link in X's Card Validator to refresh the cached preview.
Why isn't my OG image showing?
Common causes: a relative URL instead of an absolute https one, a file over the platform limit (5–8MB), missing og:image:width/height tags, or a stale cache. LinkedIn caches especially hard. Use Facebook's Sharing Debugger, X's Card Validator, or LinkedIn's Post Inspector to force a re-scrape after each change.
Does this tool save my work?
Yes. Your settings are saved automatically to your browser's local storage so they survive a page reload. Click the Reset button to clear them. Nothing is sent to any server — all rendering happens locally in your browser.

Related Free Tools

QR Code Generator Color Palette Generator Color Contrast Checker

Ready to try Converge?

$49/month flat. Up to 15 agents. 7-day free trial, no credit card required.

Start Free Trial