excalidraw-skill · lingzhi227 — скилл для Claude Code
Скилл даёт агенту инструменты для рисования и правки диаграмм Excalidraw на живом канвасе, с экспортом в файлы и картинки.
npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a claude-codeЧто делает excalidraw-skill
Скилл подключает агента к канвасу Excalidraw через MCP-инструменты или REST API. Агент создаёт элементы пакетами, двигает их, выравнивает, группирует, дублирует и запирает. Посмотреть на свою работу он может через describe_scene и get_canvas_screenshot, поэтому диаграмму получается доводить итерациями, а не с первого раза вслепую.
Внутри описан порядок проверки соединения: сначала поиск MCP-инструментов, потом curl http://localhost:3000/health, и только затем инструкция поднять сервер вручную. Есть перенос схем из Mermaid и работа с .excalidraw, PNG и SVG. Снимки канваса сохраняются и восстанавливаются по имени.
Для работы нужен запущенный сервер канваса. Его адрес задаётся переменной EXPRESS_SERVER_URL, по умолчанию http://localhost:3000. Скриншот и экспорт картинки в режиме REST требуют открытого браузера, а часть операций доступна только через MCP — без сервера MCP-инструментов эти шаги не отработают.
Какие задачи решает
- нарисовать схему сервисов на живом канвасе
- поправить диаграмму по скриншоту, а не наугад
- перегнать Mermaid-схему в редактируемый Excalidraw
- выгрузить диаграмму в PNG или SVG
- сохранить снимок канваса и вернуться к нему позже
Примеры запросов агенту
- Нарисуй на канвасе схему из трёх сервисов и базы, потом покажи скриншот
- Переведи Mermaid из
flow.mmdв элементы Excalidraw - Сохрани снимок канваса под именем
before-refactor
Как установить excalidraw-skill
1Через Skills CLI (Vercel)
npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a claude-code2Вручную: положить файлы
~/.claude/skills/excalidraw-skill/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/excalidraw-skill/
1Через Skills CLI (Vercel)
npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a codex2Вручную: положить файлы
.agents/skills/excalidraw-skill/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a cursor2Вручную: положить файлы
.cursor/skills/excalidraw-skill/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install lingzhi227/agent-research-skills excalidraw-skill2Вручную: положить файлы
.github/skills/excalidraw-skill/SKILL.md1Через Skills CLI (Vercel)
npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a gemini-cli2Командой платформы
gemini skills install https://github.com/lingzhi227/agent-research-skills --path skills/excalidraw-skillВручную: положить файлы
.devin/skills/excalidraw-skill/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о excalidraw-skill
Как установить excalidraw-skill в Claude Code?
Выполните npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a claude-code, затем проверьте файл ~/.claude/skills/excalidraw-skill/SKILL.md.
Что делает excalidraw-skill?
Даёт агенту набор операций над элементами диаграммы Excalidraw: создание, правка, удаление, выравнивание, группировка, а также снимки канваса и экспорт в файлы и картинки.
Что нужно, чтобы скилл заработал?
Запущенный сервер канваса, адрес которого передаётся в EXPRESS_SERVER_URL (по умолчанию http://localhost:3000). Скриншоты и экспорт в изображение работают при открытом браузере, а get_canvas_screenshot, read_diagram_guide и export_to_excalidraw_url есть только в режиме MCP.
Похожие скиллы
Все скиллы по теме «Настройка агента: память, контекст, субагенты» →Сначала — excalidraw-skill от других авторов.
