An AI assistant can make Open Graph images for you if it can call an image API — and the Model Context Protocol (MCP) is the standard way to give it that ability. Once an MCP server is connected, you can ask "make an OG image for this post" in chat and get back a finished 1200×630 PNG, or ask a coding agent to "add per-page og:image tags to this site" and it will write the code using the same API.
This guide explains what MCP adds over asking an image model to draw, shows the setup for the common clients, and the prompts that work.
Why not just ask the model to draw it?
Image-generation models are good at illustrations and bad at the things a social card needs: the exact title spelled correctly, your brand colours, the same layout on every post, text that stays inside 1200×630. An OG image is closer to a document than to a picture.
With MCP the assistant does not draw. It calls a tool that fills a template — HTML and CSS rendered in a real browser — with fields it extracted from your content. The model's job is the part it is good at: reading a blog post and picking the title, the author, a short eyebrow label. The layout is fixed and the text is exact.
What MCP is, in one paragraph
MCP is an open protocol for connecting AI applications to external tools and data. A server publishes a list of tools with JSON schemas; the client (Claude Code, Cursor, an API call) shows them to the model, which decides when to call them. Remote servers use the Streamable HTTP transport, so a hosted API can be an MCP server at a single URL. Authentication is whatever the server asks for — commonly an Authorization header or OAuth.
What the Shareglint server exposes
Shareglint's MCP endpoint is https://shareglint.com/mcp, authenticated with the same Authorization: Bearer sk_live_… key as the HTTP API — the same account, quota and limits. Its tools: render_image, get_image, list_templates, get_template, create_signed_url, get_usage, generate_template, take_screenshot, auto_og_url.
The ones you will use most:
list_templates— the built-in templates (21 of them) and your own, with their fields.render_image— renders a template with field values and returns a public image URL. Counts as one render; the same fields again cost nothing.create_signed_url— builds a URL for<meta property="og:image">that renders on first request. No quota is used until someone fetches it.generate_template(paid plans) — designs a new template from a text description or a screenshot, with a free preview.
Connect your client
Claude Code — one command (see Claude Code's MCP docs):
claude mcp add --transport http shareglint https://shareglint.com/mcp \
--header "Authorization: Bearer $OG_API_KEY"
Cursor (~/.cursor/mcp.json, or .cursor/mcp.json in a project; Cursor docs) — the key comes from an environment variable, not the file:
{
"mcpServers": {
"shareglint": {
"url": "https://shareglint.com/mcp",
"headers": { "Authorization": "Bearer ${env:OG_API_KEY}" }
}
}
}
VS Code (.vscode/mcp.json; VS Code docs), with the key asked for once and stored by VS Code rather than written in the file:
{
"inputs": [
{ "type": "promptString", "id": "og-key", "description": "Shareglint API key", "password": true }
],
"servers": {
"shareglint": {
"type": "http",
"url": "https://shareglint.com/mcp",
"headers": { "Authorization": "Bearer ${input:og-key}" }
}
}
}
From code — both major model APIs can call a remote MCP server on your behalf:
// Claude API (MCP connector)
"mcp_servers": [{ "type": "url", "url": "https://shareglint.com/mcp", "name": "images", "authorization_token": "sk_live_…" }]
// OpenAI Responses API
"tools": [{ "type": "mcp", "server_label": "images", "server_url": "https://shareglint.com/mcp",
"headers": { "Authorization": "Bearer sk_live_…" } }]
Chat apps are the weak spot. ChatGPT's custom MCP servers (Business and Enterprise/Edu workspaces) authenticate with OAuth or no auth, with no API-key option documented (OpenAI); Claude.ai's custom connectors offer request headers only as a beta for a limited set of organizations (Anthropic). Until a server supports OAuth, use one of the clients above.
Prompts that work
One image from content you paste:
Make an Open Graph image for this blog post with the blog-og template. Use the post title as the title, "Engineering" as the eyebrow, and yourblog.com as the site. Give me the URL.
The assistant calls list_templates (or skips it if it already knows blog-og), then render_image, and replies with the PNG URL. Ask for format: "jpeg" if the image is going somewhere that prefers smaller files.
Wire it into a codebase — this is where a coding agent earns its keep:
This is a Next.js app router project. Add per-page og:image tags to the blog using signed image URLs with the blog-og template. Put the signing code in lib/og.ts, read OG_ACCOUNT_ID and OG_SIGNING_SECRET from the environment, and do not call the API at request time.
The agent can call create_signed_url once to see a correct example, write a signing helper, and add it to generateMetadata. Because it uses signed URLs, the API key stays in the agent's configuration — your deployed site only needs the signing secret. Ask it to compare its helper's output with a URL from create_signed_url for the same fields; if the two match, the signing is right.
A new template from a design:
Here is a screenshot of our current share card. Create a template that looks like it, with fields title, category and date, and show me the preview.
generate_template returns HTML, CSS, the field list and a preview image without saving anything; ask it to save once you are happy, then render with the new slug.
Check your budget before a batch:
How many renders do I have left this month? Then render cards for these 40 titles.
get_usage answers the first part. Renders beyond the quota fail with a clear quota_exceeded error rather than an unexpected bill.
Limits worth knowing
- The assistant is only as careful as your prompt. Name the template and the fields; "make a nice image" invites guessing.
- Tools act on your account. A key connected to an agent can use your monthly quota — give agents a separate key you can revoke on its own.
- Images rendered on the Free plan carry a small badge, the same as through the API.
- MCP clients change quickly; if a client's config format differs from the examples above, its own documentation wins. The server side — URL, header, tool names — does not change between clients.
No MCP support in your tool at all? Point the assistant at /llms-full.txt or the OpenAPI document: any model that can write an HTTP request can use the API from those.
