An OG image maker for better link previews
When someone shares your page on Facebook, LinkedIn, X, WhatsApp, Slack or Discord, the app shows a preview card built from your Open Graph tags — and the biggest part of that card is the og:image. A clear, branded image gets noticeably more attention than a blank box or a random crop of your header photo. This OG image maker designs that image for you in a minute.
Type a title, subtitle, author and site name, pick one of six templates, set your colours and add your logo by dropping, choosing or pasting it. The preview is drawn on a canvas at the exact output size, so what you see is what you download: a 1200 × 630 PNG or JPG, or 2400 × 1260 for sharp results on high-density screens. Presets for X, LinkedIn, Pinterest and square posts are included, and the tool writes the matching meta tags for your page.
Everything is rendered in your browser. Your text and logo are never uploaded.
How to use the OG Image Maker
- Enter the Title (keep it under about 60 characters) and an optional Subtitle, Author and Site name.
- Choose a Template and a Size — Open Graph 1200 × 630 works for Facebook, LinkedIn, WhatsApp and most chat apps.
- Set the background (gradient, solid or gradient with a pattern), the two colours, the accent, the title font and alignment. Text colour is picked automatically for contrast unless you override it.
- Drop, paste or choose your Logo; transparent PNG or SVG files look best.
- Choose PNG or JPG and 1× or 2×, press Download image, upload the file to your site and paste the copied meta tags into the page’s
<head>.
OG Image Maker features
Six templates
Classic, Centered, Split (accent panel with your logo or initial), Bold, Card (floating panel with shadow) and Minimal.
Automatic text fitting
The title shrinks to fit three lines and the subtitle is shortened with an ellipsis rather than overflowing; long words and URLs wrap safely.
Exact export sizes
1× and 2× exports for every preset, with PNG for crisp text or JPG for smaller files.
Contrast-aware text
Automatic mode measures the background’s WCAG relative luminance and chooses white or near-black text.
Meta tags included
og:title, og:description, og:image with width, height and alt, plus twitter:card tags, all HTML-escaped.
Recommended social image sizes
Check other formats in the Social Media Image Sizes guide.
| Platform | Size used here | Notes |
|---|---|---|
| Open Graph (Facebook, LinkedIn, WhatsApp, Slack, Discord) | 1200 × 630 | 1.91:1; Facebook recommends at least 1200 × 630 for high-resolution previews. |
| X (Twitter) summary_large_image | 1200 × 600 | 2:1; X accepts 300 × 157 up to 4096 × 4096 and crops other ratios. |
| LinkedIn article / share | 1200 × 627 | Practically the same as Open Graph. |
| Pinterest pin | 1000 × 1500 | 2:3 portrait performs best in the feed. |
| Square post | 1080 × 1080 | Instagram and some chat apps. |
How to add the image to your page
Upload the downloaded file to your website or CDN and put its full address, starting with https://, into Image URL. Copy the generated tags into the <head> of the page. Social networks fetch the image when the link is first shared and cache it, so after changing an image use the platform’s sharing debugger to refresh it, or give the new file a different name.
For the rest of your tags — canonical URL, description, robots — use the Meta Tag Generator or the Open Graph Generator.
Design tips for share images
- Previews are often shown at 500 px wide or less: aim for a title of 4–10 words in a large font.
- Keep important content away from the outer 5–10%, which some apps crop or cover with rounded corners.
- Use brand colours consistently so people recognise your links in a busy feed. A soft background from the Mesh Gradient Generator works well — set the same colours here.
- Keep the file under 5 MB (X’s limit) — JPG at 1× is usually 60–200 KB.
OG Image Maker FAQ
What size should an OG image be?
1200 × 630 pixels (1.91:1) is the standard Open Graph size and works across Facebook, LinkedIn, WhatsApp, Slack and Discord. This OG image maker uses it by default.
PNG or JPG for Open Graph images?
PNG keeps text and logos perfectly sharp; JPG produces smaller files, which matters for slow connections. Both are accepted everywhere. Avoid WebP for maximum compatibility with older crawlers.
Why is my new image not showing when I share the link?
Platforms cache previews. Check that the image URL is absolute and publicly reachable, then refresh the cache with the platform’s debugger or rename the file.
Should I use the 2× version?
Most platforms downscale to well below 1200 px, so 1× is enough. 2× (2400 × 1260) helps when your image is also shown on your own site on retina screens.
Can I use my own fonts?
The title can use this site’s three fonts or your system serif and sans-serif. Custom web fonts are not loaded, to keep the tool private and fast.
Is my logo uploaded anywhere?
No. The logo is read into the page on your device and drawn onto the canvas locally.