Integration · MCP client

Connect Clearly to Claude.

Connect Clearly to Claude as an MCP server: add Clearly’s hosted endpoint to your MCP config with an API token, and Claude gains tools to generate editable SVG and raster art right in the conversation — headless, no browser, billed to your Clearly plan.

How do you connect Clearly to Claude?

Connect Clearly to Claude as an MCP server: add Clearly’s hosted endpoint to your MCP config with an API token, and Claude gains tools to generate editable SVG and raster art right in the conversation — headless, no browser, billed to your Clearly plan.

Connect

Add Clearly to Claude

Under a minute — nothing to deploy; the server is hosted.

  1. 01Mint an MCP token in Clearly (Settings → Developers, scope rpc:write).
  2. 02Add the Clearly server to Claude Desktop’s mcp.json with that token.
  3. 03Restart Claude — clearly_generate_svg and clearly_generate_image appear in its tools.
  4. 04Ask Claude to make an icon, logo, or illustration; it returns editable SVG.
mcp.json
{
  "mcpServers": {
    "clearly": {
      "url": "https://relay.clearly.sh/mcp",
      "headers": { "Authorization": "Bearer ck_mcp_..." }
    }
  }
}
What it unlocks

Claude + a design tool

Generate editable vector art from a prompt, mid-conversation

Produce raster images when you need a bitmap

Keep the SVG editable — real paths, not a flattened screenshot

Drop the result onto a Clearly canvas to refine by hand

FAQ

Clearly + Claude, answered

01How do you connect Clearly to Claude?+
Connect Clearly to Claude as an MCP server: add Clearly’s hosted endpoint to your MCP config with an API token, and Claude gains tools to generate editable SVG and raster art right in the conversation — headless, no browser, billed to your Clearly plan.
02Is the Clearly Claude integration free?+
Connecting is free — you mint an API token and add the hosted server, nothing to deploy. Generations are metered against your Clearly AI pool, with the per-call cost returned so spend is auditable.
03Does Claude get editable SVG or a flat image?+
Editable SVG. clearly_generate_svg returns real <svg> path code your agent can post-process, recolor, or hand to a cutter — not a flattened screenshot. Raster is available via clearly_generate_image when you need a bitmap.

Give Claude a design tool

Mint a token, connect the hosted server, and start generating editable art right where you work.