What size should an Open Graph (OG) image be?

The widely recommended size is 1200x630 pixels, a 1.91:1 aspect ratio. That is what Facebook, LinkedIn and the Twitter/X summary_large_image card expect, and it is exactly what this tool exports. Smaller images can be downscaled by platforms and look blurry, so 1200x630 is the safe default.

Does the exported image really come out at 1200x630?

Yes. The on-screen preview is scaled down to fit your screen, but the export draws onto a full-resolution 1200x630 canvas and downloads that as a PNG, so the file is pixel-for-pixel the correct size regardless of your display.

Are my text and images uploaded anywhere?

No. Everything happens in your browser using the HTML canvas. Background images you add are read locally and never leave your device, and the PNG is generated client-side. Nothing is sent to a server.

How do I use the generated OG meta tags?

Click Copy OG meta tags to get a block of og:image, og:image:width, og:image:height and the twitter:card and twitter:image tags. Upload your exported PNG to your site, replace the example.com placeholder URL with your real image URL, and paste the tags into the head of your page.

Why is my long title getting smaller or cut off?

Titles wrap to fit the card width. If a title runs past four lines it is trimmed with an ellipsis so it never overflows the image. For a cleaner result, shorten the title or lower the title-size slider — most strong social headlines are six to twelve words.

Can I save a design and reuse it later?

Yes. Your current design is auto-saved in this browser, and the Save preset button stores named presets in local storage so you can reload a brand style for future images. Presets stay on the device you created them on.

OG / Social Image Maker

A free Open Graph image maker that lets you design the preview card people see when your link is shared on Twitter/X, Facebook, LinkedIn, Slack, Discord and almost every other platform — then export a crisp 1200×630 PNG in one click. It is built for makers, marketers, bloggers and developers who want a clean, on-brand share image without opening a design app or wrestling with an export template.

Every social platform reads the og:image meta tag from your page and renders it as a large, eye-catching card in the feed. A good OG image measurably lifts click-through, because a bare link with no preview image is easy to scroll past. This tool gives you a realistic, full-bleed canvas, six starting templates, full control over text, colours, fonts and background, and a live preview that matches the exported file exactly.

How it works

The editor renders your design onto an HTML canvas at the exact 1200×630 dimensions that Facebook, LinkedIn and the Twitter/X summary_large_image card expect. You start from a template — Midnight, Sunset, Clean light, Terminal, Editorial, or a Photo overlay — which seeds the colours, font and layout. From there you can edit the title, an optional subtitle, and a small badge / eyebrow line for your brand.

The background can be a solid colour, a two-stop gradient with an adjustable angle, or an uploaded photo with a dark overlay slider so your text stays readable. Text is wrapped automatically to fit the card, and over-long titles are trimmed with an ellipsis so nothing ever spills off the edge. You also control the title size, padding, alignment, an optional accent bar, and the colour of every text element. The preview you see is the same drawing routine used for export, so what you see is what you download.

When you are happy, Download PNG saves the full-resolution file, and Copy OG meta tags gives you a ready-to-paste block of og:image and Twitter card tags. Your design auto-saves to this browser, and you can store named presets to reuse a brand style.

Example

Say you are publishing a blog post titled “Build social images in your browser”. Pick the Midnight template, type the title, add the subtitle “Free Open Graph image maker — export a crisp 1200×630 PNG”, and set the badge to your site name. Nudge the gradient angle, bump the accent to your brand colour, and the live card updates instantly.

Click Download PNG and you get build-social-images-in-your-browser-1200x630.png. Upload it to your site, then paste the copied tags into your page head:

Tag	Value
`og:image`	your uploaded PNG URL
`og:image:width`	`1200`
`og:image:height`	`630`
`twitter:card`	`summary_large_image`

Share the link and every platform now shows your custom card instead of a plain URL. Everything above is generated in your browser — no numbers, text or images are uploaded.