/mermaid-render - Рендер mermaid-диаграмм в изображения
SkillDocs & knowledgeRenders mermaid diagrams to PNG/SVG/PDF via local mermaid-cli (mmdc). Use when the user asks to render mermaid, make a PNG from a diagram, turn mermaid into an image, convert .mmd to png/svg/pdf, extract mermaid from markdown into images, or save a mermaid block as an image.
Available today. Use it from your connected AI after setup.
No other account needed.
Connect ahel once, and every AI you use reads what you have installed.
Then ask your AI: use the /mermaid-render - Рендер mermaid-диаграмм в изображения skill
What this skill tells your AI
The instructions your AI receives, as published by desko77/cursor-1c-skills in skills/mermaid-render/SKILL.md and read by ahel’s review.
Тонкая обертка над 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 |
Примеры
# Простой PNG рядом с входом, дефолтная тема, scale=2
python ~/.claude/skills/mermaid-render/scripts/render.py ./diagram.mmd
# Темная тема, прозрачный фон, SVG
python ~/.claude/skills/mermaid-render/scripts/render.py ./diagram.mmd -t dark -b transparent -f svg
# Все блоки mermaid из markdown в PNG-файлы
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-документу.
Signals
- GitHub stars
- 57
- Forks
- 13
- Last commit
- Sep 2026
Advanced
- Catalog kind
- skill
- Gateway key
mermaid-render-desko77- Source
- github.com/desko77/cursor-1c-skills