OG image generator.
Type a title, pick a background, add your logo. Download a 1200x630 PNG and the og:image tags to paste.
- Free
- No signup
- Runs in your browser
Use the full https:// address. Most apps ignore a relative path like /og.png.
How it works.
- 1
Type the title and a short line under it. Add your site name and logo if you want them on the card.
- 2
Pick a background. The preview is the real 1200x630 image, drawn as you type.
- 3
Download the PNG, put it on your site, and paste the meta tags into your head.
What an OG image does
When someone shares your link on X, LinkedIn, Slack, Discord or iMessage, the app reads the og:image tag in your HTML and shows that picture as the preview. No tag, and the link shows up as a bare line of text that few people click.
1200 by 630 pixels is the size every one of these apps handles well. They crop it a little differently, so keep the title away from the very edges, which is what this layout does.
Making the preview show up
The og:image URL has to be absolute, starting with https://, and publicly reachable. A relative path like /og.png is ignored by most crawlers.
Apps cache previews hard. After you change the image, give it a new file name or add a version query such as og.png?v=2, and use the platform's own debugger to refresh it.
Questions, answered.
What size should an OG image be?
1200 by 630 pixels, an aspect ratio of about 1.91 to 1. That's what Facebook, LinkedIn, X and Slack all display well, and it's the size this generator makes.
How do I add an OG image to my website?
Upload the PNG to your site, then add a meta tag with property og:image and the full https URL of the image inside the head of the page. The generator gives you the tags ready to paste.
Why isn't my OG image showing when I share a link?
The usual causes are a relative image URL, an image behind a login, or a cached old preview. Use an absolute https URL, check the image opens in a private window, and refresh the cache with the platform's link debugger.
Do I need separate Twitter card tags?
X falls back to the og tags, but it only shows the large image if twitter:card is set to summary_large_image. The tags from this generator include it.
Is the OG image generator free?
Yes. No signup, no watermark. The image is drawn in your browser and nothing is uploaded.
More free tools.
All tools- Favicon GeneratorEvery favicon file a site needs, plus the HTML tags, in one zip.
- PNG to WebPShrink a PNG into a WebP with a quality slider and live file sizes.
- SVG to PNGRender an SVG as a crisp PNG at any size, transparent or on a colour.
- WebP to PNGTurn a WebP image into a PNG that opens in every app.
Good previews need a good app behind them.
Give every blog post its own OG image with the post title on it.. Add a landing page with a pricing section.. Let people sign in with Google.Hype Stack is a free, open-source starter: six apps on one API, with auth, billing and emails as packs. Build the rest with your coding agent.