No account, nothing uploaded

Pick a template, type your title, tune the background and add your logo, then export a retina PNG and copy the meta tags for your page. Everything runs in your browser.

Design social cards & export retina PNGs — 100% in your browser.

Canvas size ×
Template
Y
Your Name · 2h
@thedesigntools
New guide is out — free OG image studio, right in the browser.
in
The Design Tools
Design resources · 2h · 🌐
We just shipped a free OG image maker. Here’s what your link previews could look like 👇
👍 ♥ 128·24 comments
LikeCommentRepostSend
T
The Design Tools
2 hrs · 🌍
Fresh drop: design your own open graph images in seconds.
👍 86·12 shares
🔧 Design Bot · BOT · Today at 14:32
Design tools that ship faster
Free browser-based utilities for designers and developers…
thedesigntools.site
1200 × 630 px · live preview·Blog Post
BLOG POST
Design tools that ship faster

Free browser-based utilities for designers and developers. No signup, no watermark.

Design the image people see when your link is shared. Pick a template, type your title, tune the background, add your logo — then export a retina PNG and copy the meta tags to paste into your page. No account, nothing uploaded.

What this tool does

The OG image maker designs the preview card that X, Facebook, LinkedIn and Discord show when someone shares your link. Start from one of six templates — blog post, simple, minimalist, terminal, product launch or split panel — then set the title, subtitle, badge, author and brand, and style the background with gradient presets or your own colours plus a subtle pattern overlay. Upload a logo and an author avatar without creating an account; both stay in your browser. A live preview shows the card at 1200×630, 1200×600, 1080×1080 or a custom size, inside realistic X, LinkedIn, Facebook and Discord mockups, before you export.

How to make an OG image

  1. Pick a template and size. 1200×630 is the default social size; square suits profile-style shares.
  2. Type your copy. Title, subtitle, badge tag, author and site name update the preview instantly.
  3. Style it. Fonts, alignment, accent colour, gradient or solid background, and an optional pattern.
  4. Brand it. Drop in a logo and avatar — they never leave your device.
  5. Export and paste. Download the PNG at 1× or retina 2×, upload it to your site, then copy the generated meta tags into your page head.

Frequently asked questions

Do I need an account to use the OG image maker?

No. There is no sign-up and nothing to install — design the card and export. The whole tool runs in your browser.

What size should an OG image be?

1200×630 pixels is the recommended size for most social networks; the tool also offers 1200×600, 1080×1080 and custom dimensions, with 2× retina export for extra sharpness.

Where do I put the exported image and meta tags?

Upload the PNG to your site, then paste the generated snippet — og:title, og:description, og:image with width and height, plus the Twitter card tags — into your page head, updating the image URL to where you hosted the file.

Is anything uploaded to a server?

No. Text, colours, uploaded logo and avatar, and the PNG export itself are all produced client-side in your browser — nothing you design is sent anywhere.

Can it animate cards or export video?

No — it makes static cards only. For animated previews or video thumbnails you need a motion tool; this one is deliberately scoped to crisp static social cards.

Will my logo and avatar be saved?

They persist in your own browser storage so a reload keeps them, but switching devices starts fresh — export the PNG before you go.

Related tools

Compress the exported PNG with the image compressor, build the mark itself in the logo maker or icon maker, and generate the matching favicon set for the same site.

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.