Free tool · runs in your browser

OG Image Generator

Design the image that shows when your link is shared — headline, background, logo, layout — and preview exactly how it unfurls on X, LinkedIn, and Slack. Export a crisp 1200×630 PNG. Nothing uploaded.

yourbrand.com
NEW GUIDE
Plan a month of content in one afternoon
A repeatable system for social media managers and creators.
Add an image →
1200 × 630 · nothing uploaded

How the link unfurls

Y

Yourbrand@yourbrand · 2h

Wrote up the whole process — link below 👇

yourbrand.com
NEW GUIDE
Plan a month of content in one afternoon
A repeatable system for social media managers and creators.
Add an image →
Plan a month of content in one afternoon

Layout

Background

Logo

Font

Light text
How it works

From a blank link to a share-worthy card

Four steps, no login — a 1200×630 OG image, previewed in context.

  1. 1

    Write the headline

    Add a title, an optional kicker and description, and your brand or domain — the words that sell the click.

  2. 2

    Style it

    Pick a layout and background — a gradient, a solid, or your own image — add your logo, and choose the font.

  3. 3

    Check the unfurl

    The share preview shows exactly how the card looks on X, LinkedIn, and Slack before you ship it.

  4. 4

    Download the PNG

    Export a crisp 1200×630 image and set it as your page's og:image meta tag. Copy to clipboard too.

Every shared link is an ad you didn’t design — until now

When someone posts your link, the OG image is the first — often only — thing they see before deciding whether to click. Leave it to chance and you get a cropped screenshot, a stretched logo, or a grey nothing that makes the link look like spam. Design it, and every share of your blog post, landing page, or launch works as a tiny, on-brand billboard. This tool exists so you don’t need a designer or a Figma file for that: pick a layout, drop in your headline and logo, and the 1200×630 image is ready. To see how a live URL is currently unfurling, our link previewer reads the tags a page already has.

Design for the thumbnail, not the mockup

The mistake most OG images make is being designed at full size and never checked small — where they actually live, as a card in a busy feed. A headline that looks fine at 1200px can be unreadable as a thumbnail, and fine detail vanishes. That’s why the share preview here shows the card at real feed size on X, LinkedIn, and Slack: if the headline survives there, it’ll work everywhere. X raises the stakes further — it no longer prints your page title and description under the card, just the image with the headline in a small label over the corner. Whatever your link has to say on X, the image has to say it. Keep the text large, the message to one idea, and the important parts away from the edges some platforms crop. Once it’s live, a quick check in the post previewer confirms the rest of the post looks right too.

Frequently asked questions

What is an OG image?

An OG (Open Graph) image is the preview picture that appears when a link to your page is shared — on X, LinkedIn, Facebook, Slack, iMessage, and most other apps. It comes from an og:image meta tag in your page's HTML, and the recommended size is 1200×630 pixels. A blank or ugly OG image makes a shared link look untrustworthy and forgettable; a designed one turns every share into a tiny ad. This tool builds that 1200×630 image for you — headline, background, logo, and all.

What size should an OG image be?

1200×630 pixels is the standard, and it's what this tool exports. That 1.91:1 ratio is what X's large summary card, LinkedIn, and Facebook use, so a single image works across all of them. Keep the important text away from the very edges (some platforms crop a little), aim for a large, legible headline, and remember the image is often seen small in a feed — if the headline isn't readable as a thumbnail, it's too fussy. The live share preview here shows you the small-size reality.

How do I use the image once I've made it?

Download the PNG and reference it from your page's <head> with a meta tag: <meta property="og:image" content="https://yoursite.com/og-image.png" /> (and the matching twitter:image tag). Host the file somewhere public — your site, a CDN, or your CMS's media library. Most site builders and blog platforms have an OG image or 'social share image' field where you can just upload it. After you set it, use a link preview tester to confirm the platforms are picking it up.

Can I use my own logo and background?

Yes. Upload your logo and it sits on the card in the layout you choose; upload your own background image and there's an overlay control to darken it so the text stays readable, or pick one of the built-in gradients and solids. Everything is composed in your browser, so your logo, background, and unpublished headlines are never sent to a server. Combined with the layout, font, and text-colour options, that's enough to match the image to your brand without opening a design tool.

Does it work for every platform's share card?

One 1200×630 image covers the big ones — X's large card, LinkedIn, Facebook, and Slack all render that ratio — which is why the preview shows those. A few surfaces differ: some use a smaller square thumbnail for certain link types, and Slack shows a compact attachment. The image you export is the standard that works everywhere as the og:image; the preview here is to sanity-check that your headline and composition survive at feed size on the platforms that matter most.

Is anything uploaded or stored?

No. The image is composed and exported entirely in your browser — your text, logo, and background image never leave your device, there's no account, and nothing is saved when you close the tab. It's genuinely private, which matters when you're making cards for an unannounced launch or a draft page.