OG image backgrounds

Link-preview backgrounds at the 1.91:1 size X, LinkedIn, Slack and iMessage all read, with the square some apps cut from the middle marked.

Make an OG background Every size

1200 × 630 · First download free, no account · No watermark

1200 × 630

The size the Open Graph image is usually made at. The studio's 1.91:1 frame is the same shape.

Ember OG image background with its safe zones marked — Square previews
Some apps show a small square cut from the centre. Keep the title inside it and the preview still says something when it's cropped.
OG image: 1200 × 630 pixels.

Studio frame: 1.91:1
First download: 1920 × 1005
4K export: 3840 × 2010

Six to start from

Rendered at 1.91:1 by the studio's own renderer. Each opens there at this size, ready to change and export.

A background, not the whole card

The usual OG image is a title on a background. Make the background here, then set the type on top in Figma, Framer or your own @vercel/og template, so every post on your site shares the look and only the words change.

Contrast for small sizes

A preview is often seen at 300 pixels wide in a feed. Pick a palette with one calm area for the title and the gradient carries the colour, not the reading.

Coding agents can make them too

Gradients Studio has an MCP server and a ChatGPT app: ask Cursor, Claude Code or ChatGPT for an OG background in your brand colours and it renders one at 1200 × 630.

Other sizes

The same studio, set to another place a background goes.

Questions

What size should an OG image be?

1200 × 630 pixels, a 1.91:1 ratio. X, LinkedIn, Facebook, Slack and iMessage all display that shape, and some apps crop a square from the middle.

Can I put a different title on each page?

Yes. Export one background and use it in an OG template that draws the title on top, so each page gets its own card from the same image.

Is it free to download?

Yes. The first download needs no account: 1920 × 1005 at 1.91:1. A free account exports 5 4K images a month, 3840 × 2010 at this ratio, with no watermark.

Can I use my own colours?

Yes. Every example opens in the studio at 1.91:1. Change the palette (paste your brand's hex codes), the style, the grain and the blur, then export.

Make an OG background now

The studio opens at 1.91:1, 1200 × 630's shape. Shuffle until it feels right, then export.

Open the studio