Rendex
Recipe

Generate a Hosted Share Image from an AI Agent

Add the Rendex MCP server to Claude, Cursor, or Claude Code and rendex_render_link appears as a tool. When the agent is scaffolding a page or writing content and needs an image it can embed, it renders one and gets back a signed, edge-cached URL — ready to drop into an og:image tag or an <img> src — instead of raw bytes it would have to host itself.

Last updated 2026-07-21

The Problem

When an agent builds a page or writes a post, the image it needs isn't something to display once in the chat — it's something to embed: a dynamic OG image for the <head>, an <img> in a README, a social card in a doc. rendex_screenshot returns bytes, which the agent then has to store and host somewhere before markup can point at it. For a share image that a crawler fetches on every unfurl, that hosting step is the whole problem.

The Solution

The Rendex MCP server exposes rendex_render_link: it takes the same inputs as a screenshot — a url, or raw html/markdown, plus sizing and an optional Mustache data object — and instead of bytes it returns a signed, hosted, edge-cached image URL with { url, expiresAt, format, cacheTtl }. The agent pastes that URL straight into <meta property="og:image"> or an <img src>, and Rendex serves a cached copy on every share or page load. It costs one render credit for the fresh render; cached repeat hits — the crawler unfurls, the page views — don't re-charge. An optional expiresIn (60s to 30 days) controls how long the signed URL stays valid.

How the Workflow Runs

Agent has content to picture

It's writing a page, a README, or a post and needs an image URL — an og:image or an <img> — not bytes.

rendex_render_link

One MCP call with url/html/markdown (+ optional expiresIn). Rendex renders once and hosts it on the edge.

Hosted URL back

Returns { url, expiresAt, format, cacheTtl } — a cached link the agent drops straight into markup.

Input → Rendered Output

Left: a rendex_render_link tool call rendering HTML for a social card, with an expiresIn set. Right: the returned JSON { url, expiresAt, format, cacheTtl } and, below it, a <meta property="og:image"> tag using that hosted URL — the link the agent pastes into markup.

Rendered by Rendex

What You Need

  • A Rendex API key — the free tier includes 100 renders/month, no card required.
  • An MCP client: Claude Desktop, Claude Code, or Cursor.
  • The Rendex MCP server configured with your key (remote at mcp.rendex.dev, or the stdio server via npx) — see /docs/mcp.
  • Optional: an HTML/Markdown template for the card, and a data object to fill it per render.

What This Recipe Uses

A URL, not bytes

Returns a signed, hosted image URL instead of image data — drop it straight into <meta property="og:image"> or an <img src>, with nothing for the agent to store or host.

Edge-cached, charged once

One render credit for the fresh render; cached repeat hits — every share unfurl, every page view — don't re-charge, which is exactly how an og:image is consumed.

Templated per record

Takes the same inputs as rendex_screenshot plus a Mustache data object, so one HTML/Markdown template becomes many per-record cards in a loop, each with its own cached URL.

Control the lifetime

An optional expiresIn (60 seconds to 30 days) sets how long the signed URL stays valid — short for a one-off, long for a page meant to stay live.

Build It

rendex_render_link.json
// The agent renders HTML to a hosted, cached OG image URL.
{
  "tool": "rendex_render_link",
  "arguments": {
    "html": "<div style=\"width:1200px;height:630px;display:grid;place-items:center;font:700 64px system-ui;background:#0c0a09;color:#fafaf9\">Shipping MCP recipes</div>",
    "format": "png",
    "width": 1200,
    "height": 630,
    "expiresIn": 2592000
  }
}
// -> { "url": "https://api.rendex.dev/r/...", "expiresAt": "...",
//      "format": "png", "cacheTtl": 86400 }
head.html
<!-- The agent pastes the returned url straight into the page head. -->
<meta property="og:image" content="https://api.rendex.dev/r/..." />
<meta name="twitter:card" content="summary_large_image" />
<!-- Every crawler unfurl hits Rendex's edge cache — no re-charge, no self-hosting. -->
what-the-tool-sends.sh
# rendex_render_link wraps POST /v1/render-link under the hood.
curl -X POST https://api.rendex.dev/v1/render-link \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{ "html": "<div>...</div>", "format": "png", "width": 1200, "height": 630 }'
# -> { "data": { "url": "...", "expiresAt": "...", "format": "png", "cacheTtl": 86400 } }

100 free API calls/month — no credit card required. Get your API key and start building.

Reach for this whenever the agent's output is markup that needs to reference an image rather than show one: scaffolding a landing page and filling in its og:image, generating a README with a rendered banner, or producing a batch of social cards where each needs a stable link. The distinction from rendex_screenshot is the whole point — a screenshot hands back bytes the agent would have to host, while render_link hands back a URL that's already hosted and cached, so the embed just works and the crawler that fetches it on every unfurl hits Rendex's edge, not the agent. The economics fit the use case too: you pay one credit for the render, and the repeat hits that an og:image inherently gets — every share, every preview — ride the cache for free. Because it accepts a Mustache data object alongside html or markdown, an agent can turn one template into many per-record cards in a loop, each getting its own cached URL, and expiresIn lets it choose between a short-lived link for a one-off and a long-lived one for a page meant to stay up.

Frequently Asked Questions

Related Resources