Nakkas MCP Server

MCP server that turns AI into an SVG artist. One rendering engine, AI decides everything.

Local serverstdioTypeScript

What is the Nakkas MCP server?

MCP server that turns AI into an SVG artist. One rendering engine, AI decides everything. The nakkas mcp server wraps that behind the Model Context Protocol, so an assistant can use it through 4 defined tools rather than through you.

What it actually does

  • One tool, infinite designs. — render_svg takes a JSON config. AI fills in everything
  • The AI sees its own work. — Every render returns a PNG preview, so the model critiques and revises instead of designing blind
  • Token-cheap iteration. — The SVG stays on the server as an artifact; preview and save address it by id, so revision loops don't pay for the SVG text
  • Pure declarative SVG. — CSS @keyframes + SMIL animations, no JavaScript. Survives GitHub's camo proxy
  • Zero external deps. — No cloud API, no API keys. Runs locally

Its toolset

Everything the assistant can do here goes through one of these:

  • render_svg — Takes SVGConfig JSON, returns a PNG preview + artifact id (+ design analysis warnings)
  • preview — Re-renders a stored artifact (or raw SVG) to PNG at any width
  • save — Saves a stored artifact (or raw content) to disk as SVG (text) or PNG (raster)
  • Fonts — Prefer the CSS generic families: sans-serif, serif, monospace. They resolve to a real font on every platform, both in browsers and in nakkas

Adding it to your client

nakkas on npm is all you need. Most clients run it directly, so configuration is a few lines and a restart.

When to reach for it

This sits in the developer tooling group, where several servers overlap in what they claim to do but differ sharply once you actually set them up. Nakkas's toolset — render_svg, preview, save and 1 more — is a fair guide to whether it matches your workflow. It is maintained by arikusi; worth a glance at recent repository activity before you build anything load-bearing on it.

We check each listing at SyncDev against the project's documentation before it goes live — if something here drifts out of date, it is a bug worth reporting.

Caveats

  • It runs with your machine's permissions. That is convenient and also the reason to think about what you point it at before you approve a tool call.
  • MCP clients confirm each tool call by default. Leave that on until you have watched what the nakkas mcp server does with a few real requests.

Available tools

ToolWhat it does
render_svgTakes SVGConfig JSON, returns a PNG preview + artifact id (+ design analysis warnings)
previewRe-renders a stored artifact (or raw SVG) to PNG at any width
saveSaves a stored artifact (or raw content) to disk as SVG (text) or PNG (raster)
FontsPrefer the CSS generic families: sans-serif, serif, monospace. They resolve to a real font on every platform, both in browsers and in nakkas previews. Named fonts like Arial or Helvetica only exist on some systems (not o

How to install the Nakkas MCP server

{
  "mcpServers": {
    "nakkas": {
      "command": "npx",
      "args": ["-y", "nakkas@latest"]
    }
  }
}

Configuration as documented by the project. Restart the client after saving.

Example prompts to try

  • Use Nakkas to render svg.
  • Use Nakkas to preview.
  • Use Nakkas to save.

Frequently asked questions

It connects Nakkas to MCP-compatible AI assistants such as Claude and Cursor, exposing 4 tools (render_svg, preview, save, and more) that the assistant can call on your behalf. Instead of copying data back and forth by hand, the assistant works with Nakkas directly.