Open Graph image generator

How to use the Open Graph image generator

  1. Type a title (your page title or article headline) and an optional subtitle or description.
  2. Pick a layout — split image/text, centered, or full-bleed background — to match your brand feel.
  3. Customize colors, fonts, accent shape, and optional logo. Drop an avatar or product screenshot if the layout supports it.
  4. Preview the rendered image at the standard 1200 × 630 px Facebook/LinkedIn/Twitter size.
  5. Download as PNG or copy the SVG source. Reference it from your `<meta property="og:image">` tag.

When to use it

Reach for it whenever you need a custom Open Graph preview for a blog post, landing page, or shared link. Done-by-default OG images (the favicon or a generic banner) get ignored on social. A purpose-made OG image consistently doubles social CTR. Alternative: design tools like Figma give you more control; this tool is faster when you need a templated image right now.

Frequently asked questions

What size should an Open Graph image be?
1200 × 630 px is the universal safe size — Facebook, LinkedIn, and Slack render it well, and Twitter displays it as a `summary_large_image` card. The generator outputs at exactly that size.
Does the OG image generator support custom fonts?
Pick from the built-in web-safe set (Inter, Poppins, Playfair, JetBrains Mono). Custom fonts won't render in social-media link unfurlers reliably — stick to system or Google Fonts.
Why is my OG image not showing on Facebook?
Three common reasons: (1) the `og:image` URL is relative — it must be absolute. (2) Facebook's debugger has cached an old version — re-fetch via the Sharing Debugger. (3) The image exceeds 8 MB — keep PNGs under 1 MB.
Can I generate OG images programmatically?
This tool is GUI-only. For programmatic generation (e.g., per-blog-post images), use a Vercel-OG or Satori-based render at build time, or a serverless image function.
Will this work for Twitter cards?
Yes — Twitter's `summary_large_image` card uses the same 1200×630 image. Add `<meta name="twitter:card" content="summary_large_image">` and Twitter picks up the OG tag.
How big should the title text be?
Keep titles under 60 characters and use a font size of at least 48 px. Smaller text gets unreadable when LinkedIn or Slack render the card thumbnail at small sizes.

Related tools

Last updated: 2026-04-27