nakkaş в переводе с турецкого (устар.) означает художник/живописец.
"make a neon terminal logo with animated binary digits"
→ AI constructs JSON config
→ nakkas renders to animated SVG
→ clean animated SVG outputОдин инструмент, бесконечные дизайны. render_svg принимает JSON-конфигурацию. ИИ заполняет всё остальное.
Схема, созданная для ИИ. Каждое поле имеет аннотации .describe(), чтобы модель знала, что делать.
Чистый декларативный SVG. CSS @keyframes + анимации SMIL, никакого JavaScript.
Никаких внешних зависимостей. Нет облачных API, нет API-ключей. Запускается локально.
Related MCP server: inkscape_mcp
Добавьте в свой конфигурационный файл:
macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
Linux: ~/.config/Claude/claude_desktop_config.json
Windows: %APPDATA%\Claude\claude_desktop_config.json
{
"mcpServers": {
"nakkas": {
"command": "npx",
"args": ["-y", "nakkas@latest"]
}
}
}claude mcp add nakkas npx nakkas@latest{
"mcpServers": {
"nakkas": {
"command": "npx",
"args": ["-y", "nakkas@latest"]
}
}
}git clone https://github.com/arikusi/nakkas
cd nakkas
npm install && npm run build
# Use dist/index.js as the commandПопросите свой ИИ (с подключенным Nakkas):
"Создай анимированный SVG: темная рамка терминала (800×200), светящийся голубой текст 'NAKKAS', неоновый фильтр свечения, плавное появление при загрузке."
"Создай индикатор загрузки: круг с анимацией отрисовки контура, которая зацикливается каждые 1,5 секунды."
"Визуализация данных: анимированная гистограмма, 5 столбцов, каждый появляется с задержкой, градиентная заливка."
"Значок профиля (400×120): градиент от синего к фиолетовому, белый текст имени пользователя, падающая тень, тонкая пульсирующая анимация."
Nakkas предоставляет три инструмента:
Инструмент | Назначение |
| Принимает JSON SVGConfig, возвращает SVG-строку + предупреждения анализа дизайна |
| Принимает отрендеренный контент, возвращает PNG-изображение для визуальной проверки |
| Принимает отрендеренный контент, сохраняет на диск как SVG (текст) или PNG (растр) |
Рекомендуемый рабочий процесс: рендеринг → предварительный просмотр → итерация → сохранение. Инструмент save отделен от render_svg, чтобы стимулировать предварительный просмотр и доработку перед сохранением.
save{ "content": "<svg ...>...</svg>", "outputPath": "./design.svg", "format": "auto" }Форматы: auto (определяется по расширению), svg (текстовый файл), png (сначала рендерится в растр). Если файл существует, добавляется числовой счетчик, чтобы предотвратить перезапись. Возвращается фактический путь сохранения.
render_svgВходные данные: JSON-объект SVGConfig
Выходные данные: Полная XML-строка SVG плюс дополнительные примечания по анализу дизайна
После рендеринга ответ может включать предупреждения о распространенных проблемах, таких как слишком большое количество одновременных анимаций, отсутствие transformBox или масштабирование на уровне группы.
{
canvas: {
width: number | string, // e.g. 800 or "100%"
height: number | string,
viewBox?: string, // "0 0 800 400"
background?: string // hex "#111111" or "transparent"
},
defs?: {
gradients?: Gradient[], // linearGradient | radialGradient
filters?: Filter[], // preset or raw primitives
clipPaths?: ClipPath[],
masks?: Mask[],
symbols?: Symbol[],
paths?: { id, d }[] // for textPath elements
},
elements: Element[], // shapes, text, groups, use instances
animations?: CSSAnimation[] // CSS @keyframes definitions
}Тип | Обязательные поля | Примечания |
|
|
|
|
|
|
|
| Независимые горизонтальный/вертикальный радиусы |
|
| |
|
| Открытый путь: |
|
| Автоматически замыкаемая фигура |
|
| Полные команды пути SVG |
|
| URL или URI |
|
| Строка или массив |
|
| Текст вдоль кривой; путь определяется в |
|
| Общие атрибуты, применяемые ко всем дочерним элементам (без вложенных групп) |
|
| Создание экземпляра символа или клонирование элемента по |
|
| Размещение N копий по кругу |
|
| Размещение N копий вдоль дуги |
|
| Размещение копий в сетке M на N |
|
| Разброс N копий в случайных позициях |
|
| Равномерное распределение N копий вдоль полилинии |
|
| Математическая кривая: |
{
id?: string, // required for filter/gradient/clip references
cssClass?: string, // matches CSS animation names
fill?: string, // "#rrggbb" | "none" | "url(#gradId)"
stroke?: string,
strokeWidth?: number,
strokeDasharray?: string, // "10 5", use for draw-on animation
strokeDashoffset?: number,
opacity?: number, // 0–1
filter?: string, // "url(#filterId)"
clipPath?: string, // "url(#clipId)"
transform?: string, // "rotate(45)" "translate(100, 50)"
transformBox?: "fill-box" | "view-box" | "stroke-box", // set "fill-box" for CSS rotation
transformOrigin?: string, // "center", works with fill-box
smilAnimations?: SMILAnimation[]
}Ссылайтесь как filter: "url(#myId)" на любой элемент после определения в defs.filters:
{ "type": "preset", "id": "myGlow", "preset": "glow", "stdDeviation": 8, "color": "#ff00ff" }Пресет | Ключевые параметры | Эффект |
|
| Мягкий ореол |
|
| Интенсивное яркое свечение |
|
| Гауссово размытие |
|
| Падающая тень |
|
| Смещение турбулентности (анимированное) |
|
| Обесцвечивание |
| — | Теплый тон сепии |
| — | Инверсия цветов |
|
| Усиление/уменьшение насыщенности |
|
| Сдвиг оттенка |
|
| Разделение каналов RGB для эффекта искажения линзы |
|
| Зернистость пленки и наложение текстуры |
|
| Цветной контур вокруг элемента |
|
| Тень внутри элемента |
|
| Эффект 3D-рельефа |
{
"animations": [{
"name": "pulse",
"duration": "2s",
"iterationCount": "infinite",
"direction": "alternate",
"keyframes": [
{ "offset": "from", "properties": { "opacity": "0.3", "transform": "scale(0.9)" } },
{ "offset": "to", "properties": { "opacity": "1", "transform": "scale(1.1)" } }
]
}],
"elements": [{
"type": "circle",
"cx": 100, "cy": 100, "r": 40,
"cssClass": "pulse",
"transformBox": "fill-box",
"transformOrigin": "center"
}]
}Ключи CSS-свойств: camelCase (strokeDashoffset) или kebab-case (stroke-dashoffset). Работают оба варианта.
Анимируемые CSS-свойства: opacity, fill, stroke, transform, filter, clip-path, stroke-dasharray, stroke-dashoffset, font-size, letter-spacing и другие.
Три типа SMIL, определяются внутри каждого элемента через smilAnimations: []:
{ "kind": "animate", "attributeName": "d", "from": "...", "to": "...", "dur": "2s" }
{ "kind": "animateTransform", "type": "rotate", "from": "0 100 100", "to": "360 100 100", "dur": "3s" }
{ "kind": "animateMotion", "path": "M 0 0 C ...", "dur": "4s", "rotate": "auto" }Морфинг путей (attributeName: "d"): начальный и конечный пути должны иметь идентичные типы и количество команд. Различаться могут только координаты.
Системные шрифты работают везде без загрузки: Arial, Helvetica, Courier New, Georgia, Verdana, monospace, sans-serif, serif.
Пользовательские семейства шрифтов также принимаются. Они работают, если шрифт доступен в среде рендеринга (веб-страница с загруженными шрифтами, дизайнерский инструмент и т.д.).
Контекст | CSS @keyframes | SMIL | Внешние шрифты | Интерактивность (onclick) |
GitHub README | ✅ | ✅ | ❌ | ❌ |
Веб-страница | ✅ | ✅ | ❌ | ❌ |
Встроенный SVG на веб-странице | ✅ | ✅ | ✅ | ✅ |
Экспорт из дизайн-инструмента | ✅ | ✅ | ✅ | — |
Просмотрщик статических файлов | ✅ | ✅ | зависит от | зависит от |
Это означает, что SDK MCP отклонил входные данные до того, как они достигли обработчика. Обычно это происходит при первой попытке и работает при повторной. Самые частые причины:
Опечатка в типе градиента. Используйте "linearGradient" или "radialGradient", а не "linear" или "radial". Это самая частая ошибка.
Смещение ключевого кадра как строка. Пишите 0 или 100 (числа) или "from" / "to". Написание "0%" или "100%" приведет к ошибке.
Именованные цвета. Работают только шестнадцатеричные значения: "#ff0000", а не "red". rgb() также не поддерживается.
Отсутствие type у элементов. Каждый объект элемента должен иметь поле type.
Если вы создаете интеграцию с MCP-клиентом и постоянно видите эту ошибку, проблема, скорее всего, в том, как ваш клиент сериализует аргументы. См. anthropics/claude-code#29104 для контекста об известных особенностях сериализации.
Инструмент предварительного просмотра рендерит статический снимок в момент времени t=0. Анимации не захватываются. То, что вы видите, — это начальное состояние SVG до начала любой CSS или SMIL анимации.
Если изображение полностью пустое:
Проверьте, установлены ли у ваших элементов fill или stroke. Фигура без заливки на прозрачном холсте невидима.
Проверьте координаты. Элемент с x: 2000 на холсте шириной 800px просто находится за пределами экрана.
Если используете filter: "url(#myFilter)", убедитесь, что myFilter действительно определен в defs.filters.
GitHub README рендерит SVG через теги <img>, которые удаляют JavaScript, но сохраняют CSS и SMIL. Если ваша анимация работает локально, но не на GitHub:
Избегайте <script> или обработчиков событий (onclick, onmouseover). Они удаляются.
Внешние шрифты не загрузятся. Используйте системные шрифты: Arial, Courier New, Georgia, monospace, sans-serif.
CSS @import для шрифтов заблокирован. Если вам нужен специфический шрифт, используйте встроенный <text> с системным резервным вариантом.
Если render_svg возвращает предупреждение о размере файла (более 50 К
Render SVG content to a PNG image so the AI can visually inspect the output.
When to use:
render_svg already returns a preview image by default; call this tool to re-preview a stored artifact at a different width, or to preview SVG that did not come from render_svg
Stop iterating when the visual result matches the intent
Input: pass EITHER artifact (id from render_svg, e.g. "art-1" — preferred, no SVG resend) OR content (raw SVG string).
Behavior:
Returns a PNG image (base64) rendered from the SVG
Background is transparent by default
CSS animations and SMIL are rendered as a static snapshot (t=0) — motion is not captured
Width:
Omit width to use the SVG's own declared width/viewBox
Pass width to scale the output (useful for small SVGs that need a larger preview)
| Name | Required | Description | Default |
|---|---|---|---|
| width | No | Render width in pixels; defaults to SVG's own declared width | |
| format | No | Content format; auto-detected from content if omitted | |
| content | No | SVG string to render as PNG. Only needed when no artifact id exists. | |
| artifact | No | Artifact id returned by render_svg (e.g. "art-1"). Preferred over content. |
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
The description discloses that the output is a PNG base64, background is transparent, animations are static snapshots, and width can be omitted or specified. It does not contradict any annotations (none provided). However, it does not explain the 'format' parameter's effect (e.g., when to use 'html') though schema covers it.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is well-structured with sections (When to use, Input, Behavior, Width), front-loaded with purpose, and every sentence adds value without unnecessary text.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given 4 optional parameters, no output schema, and no annotations, the description covers key behaviors and usage contexts. It does not explicitly state mutual exclusivity of artifact and content, but the 'pass EITHER' guidance implies it.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema coverage is 100% so baseline is 3. The description adds meaning by explaining that 'artifact' is preferred over 'content', width can be left to default, and content is only needed when no artifact id exists.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description states clearly 'Render SVG content to a PNG image so the AI can visually inspect the output.' It distinguishes from sibling tool render_svg by noting that render_svg already returns a preview and this tool is for re-previewing or previewing external SVG.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The 'When to use' section explicitly tells when to use this tool vs render_svg, including re-previewing artifacts or previewing SVG from other sources. It also advises to stop iterating when visual result matches intent.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Render animated SVG from JSON config. AI controls all design parameters.
Workflow: render_svg returns a PNG preview of the result plus an artifact id — critique the image, revise the config, render again. Iterate at least 3 times before finalizing. The SVG text stays on the server: pass the artifact id to save (and to preview for a different width). Add output:{svg:true} only if you actually need the SVG text in the conversation.
output options (response shape, not content): {"svg":false,"preview":true,"previewWidth":800,"minify":false,"frames":4} — all optional. minify:true collapses whitespace in the stored/saved SVG. frames:N (2-10) replaces the static preview with one filmstrip image sampling the CSS animations at N times — use it to verify motion (rotation direction, timing, easing) since a single preview only shows t=0. SMIL is not sampled.
Element types: rect, circle, ellipse, line, polyline, polygon, path, image, text, textPath, group, use, radial-group, arc-group, grid-group, scatter-group, path-group, parametric
Pattern groups (use for repetitive designs): radial-group (circular: cx, cy, radius, count), arc-group (arc: cx, cy, radius, count, startAngle, endAngle), grid-group (matrix: cols, rows, colSpacing, rowSpacing), scatter-group (random: width, height, count, seed), path-group (along polyline: waypoints, count). Each takes ONE "child" element.
Parametric curves (fn field): rose, heart, lissajous, spiral, star, superformula, epitrochoid, hypotrochoid, wave. Size via "scale" field. Server computes coordinates.
defs: gradients (linear/radial, SMIL animated stops), filters (presets: glow, neon, blur, drop-shadow, glitch, chromatic-aberration, noise, outline, inner-shadow, emboss + 5 more), clipPaths, masks, patterns (tile fills).
Animations: CSS @keyframes via animations array. Set cssClass on element matching animation name. For transforms add transformBox="fill-box" transformOrigin="center". SMIL via smilAnimations on elements (animate, animateTransform, animateMotion).
Critical format rules:
Gradient type must be "linearGradient" or "radialGradient" (not "linear"/"radial"). Each needs id, stops (array with offset 0-1, color).
Filter type must be "preset" with a "preset" field: {"type":"preset","id":"myGlow","preset":"glow","stdDeviation":8,"color":"#ff00ff"}
Keyframe offset: use "from"/"to" or percentage number 0-100 (not "0%"/"100%").
Gradient stop and filter colors: hex only (#rrggbb or #rrggbbaa). Element fill/stroke accept '#rrggbb', 'none', or 'url(#id)' (hex is safest).
Every element needs "type" field. circle needs r, rect needs width+height, path needs d.
Field names that differ from raw SVG:
text: string goes in "content" (not "text"): {"type":"text","x":100,"y":50,"content":"Hello","fontSize":24,"textAnchor":"middle"}
textPath: {"type":"textPath","pathId":"idFromDefsPaths","text":"..."} — here the field IS "text".
group: {"type":"group","children":[...]} — children are shapes/text/use only, no nested groups.
Pattern groups take ONE "child" element drawn at local origin (child uses cx=0/cy=0); set rotateChildren:false to keep text upright.
Output: Pure SVG XML. No JavaScript. CSS @keyframes + SMIL only.
| Name | Required | Description | Default |
|---|---|---|---|
| defs | No | ||
| canvas | Yes | ||
| output | No | ||
| elements | Yes | ||
| animations | No |
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description carries full burden. It transparently discloses that SVG text stays on the server (access via artifact id), describes output format (PNG preview + artifact id), explains field name differences from raw SVG, critical format rules, and the behavior of pattern groups and parametric curves. No contradictions.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is long but well-structured with sections (Workflow, output options, element types, pattern groups, etc.). Every sentence adds necessary detail given the complexity of SVG rendering. Slightly verbose but justified; could be tightened without losing clarity.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's complexity (5 params, nested objects, no output schema), the description covers all essential aspects: input structure, workflow, output format, edge cases (field name differences, format rules), and usage of defs and animations. It explains return values (PNG preview + artifact id) despite no output schema.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 0%, so the description must compensate fully. It provides extensive detail on each parameter group (canvas, elements, animations, output, defs) with examples, required fields, and format constraints (e.g., gradient type must be 'linearGradient', elements need 'type' field). This goes far beyond the bare schema.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description begins with 'Render animated SVG from JSON config', clearly stating the tool's core function. It distinguishes from siblings (preview, save) via workflow context, and the detailed enumeration of element types, animations, and output options reinforces the specific purpose.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides an explicit iterative workflow ('critique, revise, render again, iterate at least 3 times'), explains when to use output options like 'svg:true', and when to preview for different widths. However, it doesn't explicitly state when not to use this tool relative to the sibling tools, though the context strongly implies it.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Save rendered content to disk. Format-aware: can save as text or render to raster image.
IMPORTANT: Use this only AFTER iterating on the design with render_svg's preview images. Do not save on the first render. Preview and refine your work first.
Input: pass EITHER artifact (id from render_svg, e.g. "art-1" — preferred, no SVG resend) OR content (raw string).
Format detection:
'auto' (default): infers format from file extension. .svg saves as text, .png renders to image.
'svg': saves content as a UTF-8 text file
'png': renders the content (assumed SVG) to a PNG image, then saves it
If the file already exists, a numeric counter is appended before the extension to prevent overwriting: design.svg becomes design-1.svg, then design-2.svg. The actual saved path is returned in the response.
| Name | Required | Description | Default |
|---|---|---|---|
| width | No | For raster formats (png): render width in pixels. Defaults to the source content's own declared dimensions. | |
| format | No | Output format. 'auto' infers from file extension (.svg saves as text, .png renders to image). 'svg' saves content as a UTF-8 text file. 'png' renders SVG content to a PNG image before saving. | auto |
| content | No | Raw content to save. Only needed when the content did not come from render_svg. | |
| artifact | No | Artifact id returned by render_svg (e.g. "art-1"). Preferred over content. | |
| outputPath | Yes | File path to save to. The directory must already exist. If the file already exists, a numeric counter is appended before the extension: design.svg becomes design-1.svg, then design-2.svg, and so on. The actual saved path is returned in the response. |
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description fully discloses behaviors: format detection (auto, svg, png), file overwrite prevention with numeric counter, and input options (artifact vs content). No contradictions.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
Well-structured with sections, bullet points, and bolded keywords. Every sentence earns its place—no fluff. Efficiently communicates complex behavior in a few paragraphs.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a tool with 5 params, no annotations, and no output schema, description covers all aspects: input selection, format handling, overwrite behavior, and return value. Complete enough for an agent to use correctly.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema coverage is 100%, but description adds crucial context: width defaults to source dimensions, artifact is preferred over content, outputPath explains counter behavior, format enum values are elaborated. Adds significant value beyond schema.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states 'Save rendered content to disk' and distinguishes itself from siblings (preview, render_svg) by specifying it is for final saving after iterating on design.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
Explicitly says 'Use this only AFTER iterating on the design with render_svg's preview images' and warns 'Do not save on the first render', providing clear usage context and when-not-to-use.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
v0.3.0render_svg1 field changedInput schema / properties / output / properties / framesAdded value: +{
+ "type": "number"
+}v0.2.0preview3 fields changedInput schema / properties / artifactAdded value: +{
+ "description": "Artifact id returned by render_svg (e.g. \"art-1\"). Preferred over content.",
+ "type": "string"
+}Input schema / properties / content / descriptionPrevious value: -"SVG string to render as PNG"New value: +"SVG string to render as PNG. Only needed when no artifact id exists."Input schema / requiredRemoved value: -[
- "content"
-]render_svg6 fields changedInput schema / additionalPropertiesPrevious value: -falseNew value: +trueInput schema / properties / animations / items / additionalPropertiesPrevious value: -falseNew value: +trueInput schema / properties / animations / items / properties / keyframes / items / additionalPropertiesPrevious value: -falseNew value: +trueInput schema / properties / canvas / additionalPropertiesPrevious value: -falseNew value: +trueInput schema / properties / defs / additionalPropertiesPrevious value: -falseNew value: +trueInput schema / properties / outputAdded value: +{
+ "additionalProperties": true,
+ "properties": {
+ "minify": {
+ "type": "boolean"
+ },
+ "preview": {
+ "type": "boolean"
+ },
+ "previewWidth": {
+ "type": "number"
+ },
+ "svg": {
+ "type": "boolean"
+ }
+ },
+ "type": "object"
+}save3 fields changedInput schema / properties / artifactAdded value: +{
+ "description": "Artifact id returned by render_svg (e.g. \"art-1\"). Preferred over content.",
+ "type": "string"
+}Input schema / properties / content / descriptionPrevious value: -"Content to save. This is typically the output of a render tool such as render_svg."New value: +"Raw content to save. Only needed when the content did not come from render_svg."Input schema / requiredPrevious value: -[
- "content",
- "outputPath"
-]New value: +[
+ "outputPath"
+]v0.1.0render_svg2 fields changedInput schema / properties / animations / items / properties / keyframes / minItemsRemoved value: -2Input schema / properties / elements / minItemsRemoved value: -1v0.1.3previewrender_svgsaveScored across 3 tools
Each tool has a clearly distinct purpose: render_svg generates SVG from config, preview renders existing or external SVG to PNG, and save persists rendered content. The overlap where render_svg includes a preview by default is explicitly handled by the preview tool's description, so no ambiguity exists.
All names use lowercase snake_case and are short, but there is a minor deviation: render_svg follows verb_noun while preview and save are bare verbs. The pattern is still predictable and readable, with only a slight structural inconsistency.
Three tools is well-scoped for a focused SVG rendering service. Each tool earns its place: render for creation, preview for inspection, save for persisting output. No unnecessary duplication or bloat.
The tool surface covers the full intended workflow: render generated content, preview it at different sizes or from external SVG, and save as text or image. There are no obvious dead ends or missing core operations for the server's stated purpose.
MCP server for Flux AI image generation
MCP server for Wan AI video generation
MCP server for Hailuo (MiniMax) AI video generation
Make animated videos by asking Claude, Cursor or any MCP client. Your AI writes it, we render it.