| name | mermaid-render |
| description | Рендерит mermaid-диаграммы в PNG/SVG/PDF через локальный mermaid-cli (mmdc). Используй когда пользователь просит отрендерить mermaid, сделать PNG из диаграммы, превратить mermaid в картинку, конвертировать .mmd в png/svg/pdf, извлечь mermaid из markdown в картинки, сохранить блок mermaid как изображение, нарисовать диаграмму. Принимает .mmd / .mermaid (одна диаграмма) или .md (рендерит каждый блок ```mermaid в отдельную картинку). Поддерживает темы (default/forest/dark/neutral), цвет фона и масштаб для retina. Без Docker и MCP - чистый локальный mmdc. |
| argument-hint | <входной_файл> [-o OUTPUT] [-t THEME] [-b BG] [-f png|svg|pdf] [-s SCALE] |
| allowed-tools | ["Bash","Read","Glob"] |
/mermaid-render - Рендер mermaid-диаграмм в изображения
Тонкая обёртка над mmdc (mermaid-cli). Внутри Puppeteer + Chrome headless + mermaid.js, как в peng-shawn/mermaid-mcp-server, но без MCP-сервера и без Docker.
Зависимости
mmdc (@mermaid-js/mermaid-cli) - проверь: mmdc --version. Если нет - npm install -g @mermaid-js/mermaid-cli.- Python 3 в PATH (для скрипта-обёртки).
Использование
python ~/.claude/skills/mermaid-render/scripts/render.py <вход> [опции]
Сценарии входа
| Расширение | Поведение |
|---|
.mmd / .mermaid | Один файл с диаграммой -> одна картинка |
.md / .markdown | Извлекает все блоки ```mermaid -> по картинке на блок (<имя>-1.png, <имя>-2.png, ...) |
Опции
| Флаг | По умолчанию | Назначение |
|---|
-o, --output | рядом с входом | Выходной файл (для .md - префикс перед -N.<ext>) |
-t, --theme | default | default / forest / dark / neutral |
-b, --bg | white | white, transparent, #F0F0F0 |
-f, --format | png | png / svg / pdf |
-w, --width | mmdc default 800 | Ширина в пикселях |
-H, --height | mmdc default 600 | Высота в пикселях |
-s, --scale | 2 | Puppeteer scale - 2 для retina |
--verbose | выкл | Показать вывод mmdc |
Примеры
python ~/.claude/skills/mermaid-render/scripts/render.py ./diagram.mmd
python ~/.claude/skills/mermaid-render/scripts/render.py ./diagram.mmd -t dark -b transparent -f svg
python ~/.claude/skills/mermaid-render/scripts/render.py ./README.md
python ~/.claude/skills/mermaid-render/scripts/render.py ./d.mmd -o ./out/result.png
Алгоритм работы для Claude
- Уточни у пользователя входной файл, если не передан явно. Поддерживаются
.mmd, .mermaid, .md.
- Если пользователь не указал параметры рендера - используй дефолты (PNG, default-тема, белый фон, scale=2).
- Запусти скрипт через Bash:
python ~/.claude/skills/mermaid-render/scripts/render.py "<путь>" [-t ...] [-b ...] [-f ...]
- Скрипт печатает список созданных файлов с размерами - покажи пользователю.
- Если пользователь хочет встроить картинки в Markdown/Word - после рендера используй существующие скилы (
md-to-docx для Word, обычные ![]() ссылки для Markdown).
Поведение при ошибках
- mmdc не найден - скрипт выйдет с кодом 2 и подскажет команду установки.
- Входной файл не найден или неподдерживаемое расширение - код 2 с понятным сообщением.
- mmdc вернул ошибку (синтаксис mermaid) - код мммдц проброшен, stderr показан.
- В .md нет блоков ```mermaid - код 1, предупреждение пользователю.
Связь с другими скилами
mermaid-diagrams - руководство как СОСТАВЛЯТЬ читаемые mermaid-диаграммы. Этот скилл делает шаг рендера ПОСЛЕ составления.md-to-visio - конвертация mermaid из markdown в нативный Visio (.vsdx). Использовать когда нужен редактируемый чертеж, а не растровая картинка.md-to-docx - подключение результирующих PNG к Word-документу.
