Open source · Self-hostable · Free tier available

OG Images via API.
Zero Design Required.

Generate beautiful social cards for Twitter, Facebook, LinkedIn, and more — with a single GET request. No design tools. No headless browsers. Just fast, cached PNGs.

Open Preview Builder Read the Docs

Live Demo

Title

Template

Theme

Everything you need for social cards

A complete API for generating, customizing, and serving OG images at scale.

4 Built-in Templates

Default, Blog, Product, and Minimal templates — all customizable via query params.

Light & Dark Themes

Switch between light and dark with a single parameter. Custom colors supported too.

Edge Cached

Images are cached at the edge for blazing fast delivery. 24h cache with stale-while-revalidate.

CORS Enabled

Use from any domain. Full CORS support with proper preflight handling.

GET or POST

Simple GET with query params, or POST with JSON body for complex configurations.

Rate Limiting

Built-in rate limiting with tiered API keys. Free tier included for testing.

Simple, transparent pricing

Start free. Scale when you need to.

Free

$0forever

50 images / day

All templates
Light & dark themes
Custom colors
Small watermark
Community support

Pro

$19/month

1,000 images / day

Everything in Free
No watermark
API key access
Priority cache
Email support

Business

$49/month

10,000 images / day

Everything in Pro
Custom fonts
Webhook notifications
SLA guarantee
Priority support

Quick Start

Add OG images in under 2 minutes.

HTMLhtml

<!-- Add to your <head> -->
<meta property="og:image"
  content="https://your-domain.com/api/og?title=My+Page+Title&template=default&theme=dark" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image"
  content="https://your-domain.com/api/og?title=My+Page+Title&template=default&theme=dark" />

Next.js (App Router)typescript

// app/blog/[slug]/page.tsx
import type { Metadata } from 'next'

export function generateMetadata({ params }): Metadata {
  return {
    openGraph: {
      images: [`https://your-domain.com/api/og?title=${params.slug}&template=blog&theme=dark`],
    },
  }
}

React (react-helmet)jsx

import { Helmet } from 'react-helmet'

function BlogPost({ title }) {
  const ogImage = `https://your-domain.com/api/og?title=${encodeURIComponent(title)}&template=blog`

  return (
    <Helmet>
      <meta property="og:image" content={ogImage} />
      <meta name="twitter:image" content={ogImage} />
    </Helmet>
  )
}

cURL / POSTbash

# GET request
curl "https://your-domain.com/api/og?title=Hello+World&theme=dark" -o og.png

# POST request with JSON
curl -X POST https://your-domain.com/api/og \
  -H "Content-Type: application/json" \
  -H "x-api-key: og_pro_your_key_here" \
  -d '{"title": "Hello World", "template": "blog", "author": "Jane"}' \
  -o og.png

API Reference

Parameter	Type	Default	Description
`title`	string	-	Main heading text (required)
`subtitle`	string	-	Secondary text below the title
`template`	string	default	default, blog, product, minimal
`theme`	string	light	light or dark
`logo`	string	-	URL to logo image
`bgColor`	string	auto	Background color (hex)
`textColor`	string	auto	Text color (hex)
`width`	number	1200	Image width (200-2400)
`height`	number	630	Image height (200-1400)
`author`	string	-	Author name (blog)
`date`	string	-	Date string (blog)
`readingTime`	string	-	Minutes to read (blog)
`price`	string	-	Price display (product)
`cta`	string	-	CTA button text (product)
`productImage`	string	-	Product image URL (product)

OG Images via API.Zero Design Required.