Open Graph Image Maker

Design the 1200 × 630 preview card that social networks show when your page is shared — title, site name and accent — and copy the meta tags that wire it up.

Style
Theme
Accent bar
Accent colour
Title size72px
Preview exact export, 1200 × 630
The tags that use it paste into your page's head

    
  

Runs entirely in this browser. Nothing you type is uploaded, stored or seen by us.

How it works

Three steps, no account.

  1. 01

    Type the title

    Long titles step down in size until they fit — nothing ever clips off the edge.

  2. 02

    Pick the style

    Dark or light, an accent colour, and where the accent bar sits. The preview updates as you change them.

  3. 03

    Download and wire it up

    The PNG is the exact preview. Upload it to your site, then paste the copied meta tags into the page head with your image URL in place.

When a link is shared on Facebook, LinkedIn, Slack or X, the big picture in the preview is the Open Graph image — whatever URL the page names in its og:image meta tag. A page without one gets a grey box or a randomly scraped picture, and shared links with an image are consistently clicked more than links without.

This draws that image at the exact 1200 × 630 pixels the networks want, in your browser, from the same canvas you download — so the preview you see is the file you get. It also writes the four meta tags that make the image work, because generating the picture is only half the job.

Questions

Open Graph Image Maker, answered.

Make it 1200 × 630 pixels — a 1.91:1 shape. Facebook and LinkedIn recommend exactly that, X uses the same shape for large cards, and everything bigger is scaled down to it. Below 600 × 315 some networks refuse the image; at 1200 × 630 nothing does.

A meta tag in the page head that names the image to show when the page is shared. Crawlers do not guess from the page content — they read the tag. No tag means no image, or worse, a random one scraped from the page.

Four cover it: og:image with the full URL of the picture, og:image:width and og:image:height so the crawler can lay the card out before fetching, and twitter:card set to summary_large_image so X shows the big format. This page writes all four for you — swap in your own image URL.

Paste the URL into the sharing debugger of the network you care about — Facebook's Sharing Debugger, LinkedIn's Post Inspector, or X's Card Validator. They fetch the live page and show the card exactly as it will render, and Facebook's also clears its cache of an old image.

For a designed card like this one — flat colour and text — PNG stays small and keeps edges crisp. For a photographic image, JPEG is much smaller at the same quality. Never WebP: some crawlers still refuse it, and a refused image means no preview at all.

This is one job. The workspace does the rest.

The free tools stay free and stay ungated. Recast is where they stop being separate tabs and start handing work to each other — a link becomes a card, an article and a week of posts without you moving anything between them.