OG image generator with 74 templates
A clear preview card when you share your blog post, product or event.
PrivateNo uploadsRuns in your browserTemplates 74 of 74
Want ideas first? See finished examples for apps, shops, blogs and events.
Edit content
Product layout
For posts worth reading
A link your friends want to open.
The first blog post. A bold card shows up in every chat.
BeforeA plain grey link
With sdevA card that draws the click
The event invite
Date and title right in the preview.
The recipe page
A warm picture that makes people tap.
How to make an Open Graph image
Fill from a page or start blank
Paste a URL and press Fill to pull its title, description, logo, picture and brand colour into every template. Or press Sample and type over it.
Pick a template and edit
All 74 templates are drawn with your own content. Filter by use (SaaS, blog, shop, event and more), by picture or text and by style, click one to make it the preview, then edit the fields, colours and fonts that template offers.
Download the image
Choose PNG or JPEG, 1× (1200×630) or 2×, and press Download. Upload it and point og:image at its absolute https URL.
Good to know
- Keep the title under about 60 characters; every template clamps long text, but short reads better at thumbnail size.
- Turn on Safe zone to see the inner 1000×500 that no platform crops; keep the title, logo and button inside it.
- Most templates set the picture on a mat in its own edge colour so nothing is cut. Poster, Magazine-style and photo-led ones such as Restaurant, Workshop, News article and Link card crop it to fill.
- No picture? Filter the templates to Text only: Minimal, Gradient, Stripe, Big type, Dot grid, Terminal, Mesh, Code, Chat, Newspaper and more need none.
- The accent comes from the page's theme-color or its logo, and each template's backgrounds and buttons follow it until you set them. Reset clears every override.
- Export PNG for flat colour and text, JPEG for a photo-led card; both stay far under the 5 MB limit of LinkedIn and X.
- After uploading, put the absolute https URL in og:image (a relative path breaks every preview) and run the page through the meta tag checker to confirm it resolves.
Where people use it
Blog post previews
Paste the post link and get a neat preview card ready for WhatsApp, Facebook and X.
Launch a product page
Pick a template, add your colours and a picture, and download a sharp 1200 x 630 image.
A card for every page
Make a matching image for each page of your site in minutes.
Check the preview
See how your link will look on Google and social apps, and fix the tags.
Meta tag checker and Open Graph previewShrink the file
Make the image smaller so link previews load fast.
Compress image to 100 KB or any size
Why this one
It reads your page and fills a template for you, so a good preview image takes seconds instead of a design session.
- Over 70 templates, filtered by use, picture and style.
- Fills in the title and text from your page link.
- Change colours, fonts and picture freely.
- Download PNG or JPEG at normal or double size.
What you can change
- Template and style
- Accent colour
- Text and picture
- PNG or JPEG
- 1x or 2x size
- Safe zone guide
People find this page by searching
- og image generator
- open graph image generator
- social preview image
- link preview image
- twitter card image generator
- og image size 1200x630
- blog thumbnail maker
- whatsapp link preview image
Cite this tool
- APA
sdev.in. (n.d.). OG image generator [Web tool]. https://www.sdev.in/tools/og-image
- MLA
"OG image generator." sdev.in, https://www.sdev.in/tools/og-image.
- Chicago
sdev.in. "OG image generator." https://www.sdev.in/tools/og-image.
- BibTeX
@misc{sdev-og-image, title = {OG image generator}, author = {{sdev.in}}, howpublished = {\url{https://www.sdev.in/tools/og-image}}, note = {Web tool} }
Questions people ask
What size should an Open Graph image be?
1200×630 pixels, a 1.91:1 ratio. Facebook accepts up to 8 MB, LinkedIn and X up to 5 MB, and LinkedIn wants at least 1200×627. Every template here exports at exactly 1200×630, or 2400×1260 at 2× for sharper high-density screens, and keeps text inside the 1000×500 safe zone that no platform crops.
PNG or JPEG?
PNG keeps flat colour and text crisp, so it suits branded cards. JPEG at 80% quality is far smaller for photo-led cards. WebP is not read by every crawler and an animated GIF only shows its first frame, so stay with PNG or JPEG.
The image is uploaded but the preview is still blank. Why?
The most common cause is a relative og:image such as /images/og.png. Crawlers fetch your page in isolation and do not resolve it, so the tag must hold the absolute https URL, for example https://example.com/images/og.png. Then refresh Facebook's Sharing Debugger or LinkedIn's Post Inspector so their caches fetch the new picture.
Why do the edit fields change when I pick another template?
Each template declares what it draws. A listing shows a detail line for the price or stats, a blog post shows an author, a terminal has no picture. The editor lists only the fields and the colours and fonts that template uses, and your text carries over when you switch.
Why does my picture or logo not show in the template?
The image has to be fetched into your browser to be drawn. Most sites allow that, but some block hotlinking or every proxy. Upload the file instead with the Select button; it stays on your device.
Where does the accent colour come from?
From the page's theme-color tag when it has one, otherwise from the strongest colour in its logo. Light colours are darkened so white text stays readable. Pick a swatch or any colour to override it; each template's own backgrounds and buttons follow it until you change them.
Is anything uploaded?
No. The page is fetched into your browser, the template is drawn in your browser, and the image is produced there too. Uploaded files never leave your device. Choosing a Google font downloads that font from Google, nothing else.