OG image
What is an OG image?
The OG (Open Graph) image is the preview picture social platforms show when your link is shared — the difference between a bare grey URL and a card people actually click. This og image generator builds one live: type your title, pick a template, and the 1200×630 composition renders in your browser exactly as the exported PNG will look. The backdrop is a generated mesh gradient — shuffle it until it fits your brand — and an optional logo drops in without ever being uploaded anywhere.
How to make your social preview
- Type your title — plus an optional subtitle and domain line — in the Text drawer.
- Pick one of six templates: centered, left block, bottom-left, split with logo, badge, or minimal.
- Shuffle the backdrop until the gradient suits the page, and drop a logo if you want one.
- Leave Text tone on Auto — it picks light or dark against the backdrop, and warns if you force a clashing choice.
- Download PNG (1200×630), upload it to your site, then Copy meta tags and paste the block into your page's head.
The og image size question, answered once
Use 1200×630. Facebook and LinkedIn render that size edge-to-edge; X's large summary card crops the same file gracefully; Slack and Discord embed it as-is. Keep titles inside roughly sixty characters so the type stays large, and remember the platforms compress your image — bold text over a simple backdrop survives compression far better than intricate artwork, which is exactly the style this og image template set is built around.
Private by architecture
Most og image maker tools render your text and logo on their servers. This one renders everything — backdrop, typography, and your dropped logo — on a canvas inside your browser, so nothing you type or drop is ever transmitted. The share URL carries only the design parameters (title, template, backdrop seed), which is why a teammate opening your link regenerates the identical card. It's a twitter card generator, a link-preview maker, and an og:image workflow in one page, with zero accounts involved.
Frequently asked questions
Is this OG image generator free — and is there a watermark?
Free, no signup, and the downloaded PNG carries no watermark of any kind. The image is your title over a generated backdrop, nothing else. The one MeshSVG credit lives as a code comment in the optional Copy meta tags snippet, and you can delete it.
What size should an OG image be?
1200 × 630 pixels — the size Facebook, LinkedIn, Slack, Discord, and X (via summary_large_image) all render best, and the only size this tool exports. It stays sharp when platforms downscale it, and the 1.91:1 ratio avoids the awkward crops smaller or squarer images suffer.
How do I add the OG image to my website?
Two steps: Download PNG and upload the file to your site (the conventional path is /og-image.png at your domain root), then click Copy meta tags and paste the block into your page’s <head>. It includes og:title, og:description, og:image with width and height, and the Twitter card tags — everything the preview crawlers read.
Does this work for Twitter/X cards too?
Yes — the copied snippet sets twitter:card to summary_large_image plus the matching title, description, and image tags, which is exactly what X reads. The same 1200 × 630 PNG serves both systems; you do not need a separate image per platform.
Is my logo uploaded anywhere?
No. The logo you drop is processed entirely in your browser — it becomes a session-local object URL, is drawn onto the canvas on your machine, and never leaves it. Reloading the page clears it. That is also why a share link restores your text and backdrop but not the logo.
Why does my social preview not update after I change the image?
Platforms cache OG images aggressively. After uploading a new file, run the page through the platform’s debugger — Facebook’s Sharing Debugger, LinkedIn’s Post Inspector, or X’s Card Validator — to force a re-scrape. Changing the image filename (og-image-v2.png) is the reliable brute-force fix, since a new URL can’t be cached.
Can I get the exact same image again later?
Yes, with one exception: the share URL stores your title, subtitle, domain, template, tone, and the backdrop’s seed, so reopening it regenerates the identical composition. The exception is a dropped logo, which is session-local by design — re-drop it and everything else lines up exactly.