Skip to content

Free tool

OG image generator

Design the social preview image for your website: title, colors, logo, done. Everything runs locally in your browser: nothing is uploaded, no sign-up required.

Text

Background

Presets

Pattern

Text color

Auto picks light or dark text based on the background.

Logo (optional)

Logo position

Layout

Font

Preview

1200 × 630 px. The exported PNG is always full size

Saves as og-image.png

100% client-side. Your texts and logo never leave your device. Your settings are saved in this browser and restored on reload.

Add it to your site

Upload the PNG to your website (e.g. as /og-image.png) and put these tags inside the <head> of every page:

<meta property="og:image" content="https://www.example.com/og-image.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="twitter:card" content="summary_large_image" />

Open Graph images, explained

What is an OG image?

The Open Graph image is the preview picture that appears when someone shares your link on LinkedIn, Facebook, WhatsApp, Slack or in a chat. It is defined by a single meta tag, og:image, in the head of your page. Links with a strong preview image get noticeably more clicks than a bare URL, which makes the OG image one of the cheapest marketing assets you can ship.

The right size: 1200 × 630 pixels

The de-facto standard is 1200 × 630 pixels, an aspect ratio of 1.91:1. That size renders sharply on every major platform and stays well below file-size limits. Keep important text away from the outer edges: some platforms crop slightly or overlay UI elements, so a safe margin of about 60–80 pixels on each side is a good rule of thumb.

Twitter / X: summary_large_image

X (formerly Twitter) uses its own card system, but it happily falls back to your Open Graph tags. Add '<meta name="twitter:card" content="summary_large_image">' and X will display your 1200 × 630 image as a full-width card instead of a small thumbnail. You do not need a separate image; one well-made OG image covers all platforms.

One image per page beats one per site

A generic site-wide image works, but per-page images perform better: put the page title into the image so the preview repeats your message. With this generator you can produce a consistent set in minutes: same background, same logo, different headline.

Test your preview before you share

Platforms cache OG images aggressively. After changing the image, run your URL through one of these debuggers to refresh the cache and check the result:

Need a website worth sharing?

We design and build fast, maintainable websites and apps, from the first pixel to the meta tags. If your web presence needs more than a fresh OG image, let's talk.