Social cards from one GET request
Point your og:image tag at OGsmith and get a 1200×630 PNG back. There's no headless browser to run and no layout code to maintain, and it works on any stack that can set a meta tag.
The whole integration
Set parameters yourself:
GET https://ogsmith.app/api/og?key=og_yourkey&template=split&title=My%20post&site=myblog.com&accent=%23ff6a2b → image/png, 1200×630
Or let OGsmith read the page, so the tag is the same in every template:
<meta property="og:image" content="https://ogsmith.app/api/og?key=og_yourkey&url=PAGE_URL" />
What you don't have to build
- Rendering without a browser
- Cards render with satori in milliseconds and are served from a CDN. Fetches answered from the cache don't count against your quota. Docs
- Cards from a page's own metadata
- Pass url= and OGsmith reads the page's title, description and image, so the tag is identical across your templates. Docs
- Cache refresh
- A version number in the image address changes when a design does, so platforms that never refetch still get the new card on the next share. Docs
- Signed URLs
- HMAC-signed image URLs bind the exact parameters, so a leaked link can't be reused or edited. The signing secret is rotatable. Docs
- Keys and usage
- Up to 10 named keys per account, each revocable, with a usage endpoint that returns your plan, renders used and renders left. Docs
- Batches and webhooks
- Send a CSV, get a zip of every card, and receive a signed webhook when the batch finishes. Docs
- Experiments
- Split pages between designs and report outcomes from your own analytics. The dashboard runs the significance test. Docs
Where it plugs in
WordPress
The OGsmith plugin gives every post and page a card from its title and excerpt, works next to Yoast SEO and Rank Math, and keeps your signing secret on the server. Install guide
Claude and other MCP clients
Render cards, run batches and check usage from a conversation.
claude mcp add ogsmith -e OGSMITH_API_KEY=og_... -- npx -y ogsmith-mcp
Build it yourself, or use OGsmith?
@vercel/og is free and good. Here's what you'd be signing up to maintain. Full comparison
| Compared on | Do it yourself | OGsmith |
|---|---|---|
| Cost | Free library, your hosting | Free to start, from $19/mo |
| Time to first card | An afternoon of layout and font wrangling | Five minutes |
| Works outside your framework | Next.js and Vercel first | Any site that can set a meta tag |
| Cards from a page's own metadata | You write the scraper | Built in, with url= |
| New card on the next share after a redesign | You build cache-busting | Built in, with a version number |
| Design without code | No | Visual editor |
| A/B test designs | No | Built in, with significance |
| See what each platform shows | Separate tools per platform | Link checker for 7 platforms |
Questions
Why not build it myself with @vercel/og?
If you're on Next.js and enjoy tuning layouts, that's a fine choice. OGsmith is for when you'd rather not maintain it: it works on any stack, reads cards straight from your pages, handles cache refresh after a redesign, and gives non-developers an editor.
Does it need a headless browser or a build step?
No. Rendering happens on OGsmith's side with satori, and your site only needs to output one meta tag. Nothing is generated at build time.
Can someone else use my key from the image URL?
Keys in image URLs are visible in your pages. If that matters, use signed URLs instead: the signature covers the exact parameters, so nobody can change the card or reuse the link for other images.
What happens when I hit my quota?
New renders return an error until the 1st, and cards platforms have already cached keep working. There are no overage charges, and the usage endpoint lets you watch it from your own monitoring.
What does it cost?
Free covers 500 renders a month, with no watermark for 14 days. Pro is $19/month for 20,000 renders and Scale is $49/month for 150,000. There are no overage charges.
Your first card in five minutes
Sign up, copy your key and paste one tag. Renders are clean for the first 14 days on the Free plan.