docs-canvas — скилл для Claude Code: что делает и как установить
Скилл превращает архитектурные заметки, описания API и руководства в интерактивный холст для Cursor. Пригодится, когда вместо длинного markdown-файла нужен структурированный документ с навигацией.
npx skills add cursor/plugins --skill docs-canvas -a claude-codeЧто делает docs-canvas
Скилл превращает документацию в интерактивный холст с оглавлением и карточками разделов. В качестве источника подходят каталоги с markdown или вопросы по кодовой базе. Текст разбивается на обзорную часть, блоки примеров и список внешних ссылок. Для оформления используются таблицы, схемы на mermaid и сноски с предупреждениями. Исходные файлы связываются прямыми ссылками.
В репозитории скилл пока оформлен как черновик. Чтобы строить интерфейс точно по спецификации, требуются локальные файлы ~/.cursor/skills-cursor/canvas/SKILL.md и объявления типов в ~/.cursor/skills-cursor/canvas/sdk/index.d.ts. Без них агент сможет собрать только базовый макет по описанной схеме.
Какие задачи решает
- перевести пачку markdown-файлов в структурированный холст
- построить интерактивное руководство по архитектуре проекта
- оформить справочник по параметрам API с таблицами и примерами
- составить интерактивный разбор кодовой базы с перекрёстными ссылками
Примеры запросов агенту
- Сделай docs canvas по архитектуре сервиса на основе файлов в папке docs/
- Оформи документацию к нашему API в виде интерактивного холста с таблицами параметров
- Построй docs canvas с разбором кодовой базы и оглавлением
Как установить docs-canvas
1Через Skills CLI (Vercel)
npx skills add cursor/plugins --skill docs-canvas -a claude-code2Вручную: положить файлы
~/.claude/skills/docs-canvas/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/docs-canvas/
1Через Skills CLI (Vercel)
npx skills add cursor/plugins --skill docs-canvas -a codex2Вручную: положить файлы
.agents/skills/docs-canvas/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add cursor/plugins --skill docs-canvas -a cursor2Вручную: положить файлы
.cursor/skills/docs-canvas/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install cursor/plugins docs-canvas2Вручную: положить файлы
.github/skills/docs-canvas/SKILL.md1Через Skills CLI (Vercel)
npx skills add cursor/plugins --skill docs-canvas -a gemini-cli2Командой платформы
gemini skills install https://github.com/cursor/plugins --path docs-canvas/skills/docs-canvasВручную: положить файлы
.devin/skills/docs-canvas/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add cursor/plugins --skill docs-canvas -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о docs-canvas
Как установить docs-canvas в Claude Code?
Выполните в терминале команду npx skills add cursor/plugins --skill docs-canvas -a claude-code. Файлы скилла сохранятся в ~/.claude/skills/docs-canvas/SKILL.md.
Что делает скилл docs-canvas?
Он инструктирует агента преобразовывать технические описания, статьи и параметры API в интерактивный холст с оглавлением, карточками и схемами.
Какие файлы нужны для работы docs-canvas?
Для точного использования компонентов требуются файл правил ~/.cursor/skills-cursor/canvas/SKILL.md и TypeScript-декларации из ~/.cursor/skills-cursor/canvas/sdk/index.d.ts.
