shadcn.io— 1,000s of shadcn/ui blocks
Skip to content

Make a Discord embed image

Discord’s link unfurl is just Open Graph with a darker frame and a slightly more aggressive crop. There is no special discord:image tag. You still make a 1200×630 PNG and hang it off og:image. This page is that file, with a notice layout that survives the dark theme.

Discord · 1200×630
on this device1.91∶1

Template properties

The copy and marks on the card. Files stay on this device.

Background

Gradient or solid, then direction, grid and grain.

Gradient direction

Grid overlay
0.15

1200×630 · Discord link embeds

How it works

  1. 1Write the one line a person will see above the fold in a busy channel — shorter than an OG title — and pick a dark background so the embed does not flash on Discord’s UI.
  2. 2The notice layout is the default here: type sits in a quiet panel that still reads after Discord draws its own frame around the PNG.
  3. 3Download the 1200×630 file, host it, set og:image on the page, and paste the public URL into a test channel to confirm the unfurl before you ship.

The size, honestly

Same pixels as the generic OG card, different constraint: Discord sits on a #313338 (or darker) background and will make a paper-white card look like a flashlight. I default this page to ink and the notice layout so the embed looks like it belongs in the channel. If the link is going to Slack or iMessage as well, design it once on Generate an Open Graph image in a background that works on light and dark. Facebook’s debugger is still the worse cache — use Facebook OG Image Maker when that is the fight.

Canvas1200×630 px
Ratio1.91∶1
Used byDiscord link embeds
ExportPNG, composed in this tab

Frequently asked questions