SVG Lab

by svglab.app · app.svglab/svglab

SVG Lab MCP: the Design Engine for AI. App screens, icons, illustrations and charts as SVG.

OnlineRemote
Category
Images, video and audio
Connection
Remote (HTTP)
Tools
60 reported
Status
Online

Connect it to your AI

Claude Code

claude mcp add --transport http svglab https://svglab.app/mcp/agents

Claude, ChatGPT, Cursor and other apps

Add it as a custom connector with this URL (Streamable HTTP):

https://svglab.app/mcp/agents

Cursor, VS Code and other apps (mcp.json)

{
  "mcpServers": {
    "svglab": {
      "url": "https://svglab.app/mcp/agents"
    }
  }
}

Tools it offers

60 tools, as the server itself reported during our check on Oct 31, 2026.

  • account_statusReport the plan, access, SVG Lab credits left and what actions cost.
  • create_shapesDraw up to 80 shapes, text, paths and pencil strokes in one call; illustrations are copied from a reference. With a shell (Claude Code): write the fields to a JSON file, curl it to the upload link new_project gave and pa
  • create_pathDraw one path from anchors with optional absolute handles. With a shell (Claude Code): write the fields to a JSON file, curl it to the upload link new_project gave and pass only upload_id, so the user approves a short ca
  • pencilDraw a freehand stroke the way the Pencil tool does. With a shell (Claude Code): write the fields to a JSON file, curl it to the upload link new_project gave and pass only upload_id, so the user approves a short call.
  • edit_pathChange a path's anchors and handles in place. With a shell (Claude Code): write the fields to a JSON file, curl it to the upload link new_project gave and pass only upload_id, so the user approves a short call.
  • smooth_pathFill missing handles, refit curves, or turn a stroke into ink.
  • boolean_opUnion, subtract, intersect or exclude shapes into one new path.
  • offset_pathDraw a new path at a set distance outside or inside a path.
  • transformMove, scale or rotate shapes.
  • alignAlign shapes to a shared edge or centre.
  • distributeSpace three or more shapes evenly.
  • align_to_artboardPosition shapes relative to their artboard.
  • set_styleChange fill, stroke, caps, joins, taper or opacity.
  • set_gradientPaint fill or stroke with a linear or radial gradient.
  • set_filterSet blur, soft shadows and opacity, or clear them.
  • set_patternFill shapes with a built-in pattern.
  • clip_shapesClip or mask shapes with another shape.
  • clip_to_artboardClip shapes that cross their artboard's frame.
  • text_on_pathSet a text shape along a path.
  • set_textChange text content or typography.
  • duplicateCopy shapes in place or at an offset.
  • groupGroup shapes.
  • ungroupBreak groups into their shapes.
  • name_groupName a group.
  • reorderChange stacking order.
  • resizeSet the exact width or height of shapes.
  • fit_to_boxScale and move shapes together into a box; placing an illustration removes its drawing board.
  • fit_to_childrenResize a container to wrap its children.
  • repeatCopy shapes into a row, grid or circle.
  • mirrorMake a mirrored copy, or join a half outline with its reflection.
  • flipFlip shapes horizontally or vertically.
  • scatterPlace many seeded copies of one item inside an area.
  • add_textureAdd hatch, stipple, facet or strata marks clipped to a shape of a drawing on its "Drawing · <illustration>" board. On a screen the marks are refused as a picture drawn onto it.
  • create_iconDraw a built-in monoline icon (docs {components} names them).
  • create_layoutBuild a screen or section from a layout tree; returns boxes, ids and measured warnings. With a shell (Claude Code): write the fields to a JSON file, curl it to the upload link new_project gave and pass only upload_id, so
  • update_layoutPatch or replace a layout made by create_layout. With a shell (Claude Code): write the fields to a JSON file, curl it to the upload link new_project gave and pass only upload_id, so the user approves a short call.
  • design_tokensChange the project's design tokens. With a shell (Claude Code): write the fields to a JSON file, curl it to the upload link new_project gave and pass only upload_id, so the user approves a short call.
  • define_stylesDefine named style presets. With a shell (Claude Code): write the fields to a JSON file, curl it to the upload link new_project gave and pass only upload_id, so the user approves a short call.
  • list_design_stylesList style presets.
  • measure_textMeasure how text wraps and renders, without drawing it.

Questions

What is the SVG Lab MCP server?

SVG Lab MCP: the Design Engine for AI. App screens, icons, illustrations and charts as SVG. It is made by svglab.app and listed in the official MCP Registry as app.svglab/svglab. MCP (Model Context Protocol) is the open standard that lets AI apps like Claude, ChatGPT and Cursor use outside tools.

How do I add SVG Lab to Claude?

In the Claude app or claude.ai, open Settings, then Connectors, choose "Add custom connector" and paste https://svglab.app/mcp/agents. In Claude Code, run: claude mcp add --transport http svglab https://svglab.app/mcp/agents

How do I add SVG Lab to ChatGPT?

ChatGPT can use remote MCP servers as connectors. In ChatGPT settings, under Apps and Connectors, turn on developer mode if asked, create a new connector and paste https://svglab.app/mcp/agents.

How do I add SVG Lab to Cursor?

Open Cursor settings, go to MCP, choose "Add new MCP server" (or edit ~/.cursor/mcp.json) and add: { "mcpServers": { "svglab": { "url": "https://svglab.app/mcp/agents" } } }

Does SVG Lab work right now?

Yes. It responded when we last checked on 31 Oct 2026. We check remote MCP servers every day.

What can SVG Lab do?

It gives your AI 60 tools, including account_status, create_shapes, create_path, pencil, edit_path. The full list is on this page.

Is this your server? Get the badge for your README
chen.media/mcp badge

Markdown (GitHub README)

[![Listed on chen.media/mcp](https://chen.media/mcp/badge/app-svglab-svglab.svg)](https://chen.media/mcp/app-svglab-svglab)

HTML (switches to dark mode on its own)

<a href="https://chen.media/mcp/app-svglab-svglab"><picture><source media="(prefers-color-scheme: dark)" srcset="https://chen.media/mcp/badge/app-svglab-svglab.svg?theme=dark"><img src="https://chen.media/mcp/badge/app-svglab-svglab.svg" alt="Listed on chen.media/mcp" height="40"></picture></a>

More in Images, video and audio

See all