makepad-2.0-vector — скилл для Claude Code
Скилл учит ИИ писать векторную графику и анимации для виджета Vector в Makepad 2.0. Пригодится при сборке иконок, градиентов и эффектов интерфейса на Rust.
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-vector -a claude-codeЧто делает makepad-2.0-vector
Скилл даёт правила вёрстки векторных фигур внутри Makepad 2.0 с синтаксисом Splash. В отличие от компонента Svg, загружающего внешние файлы ресурсов, виджет Vector задаёт пути Path, базовые формы вроде Circle или Rect, а также фильтры теней прямо в коде.
Фигуры используют SVG-атрибуты вроде stroke и fill, поэтому типичные виджетные свойства draw_bg.* на них вообще не сработают. Анимация Tween подставляется прямо внутрь значений свойств: цвета, смещения или прозрачности.
Зацикливание анимации требует строго логического loop_: true или числового счётчика повторений: текстовая строка ломает бесконечный цикл. Инструкция рассчитана на ветку разработки makepad-widgets.
Какие задачи решает
- верстать векторные иконки в кодовой базе Makepad
- настраивать линейные и радиальные градиенты без внешних SVG
- анимировать параметры фигур через свойство Tween
- группировать элементы с трансформациями и фильтрами теней
Примеры запросов агенту
- Собери иконку корзины через Vector и Path для темы оформления Makepad
- Сделай пульсирующий индикатор загрузки с кругом и анимацией Tween
- Добавь в виджет векторную фигуру с линейным градиентом от красного к синему
Как установить makepad-2.0-vector
1Через Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-vector -a claude-code2Вручную: положить файлы
~/.claude/skills/makepad-2.0-vector/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/makepad-2.0-vector/
1Через Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-vector -a codex2Вручную: положить файлы
.agents/skills/makepad-2.0-vector/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-vector -a cursor2Вручную: положить файлы
.cursor/skills/makepad-2.0-vector/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install ZhangHanDong/makepad-skills makepad-2.0-vector2Вручную: положить файлы
.github/skills/makepad-2.0-vector/SKILL.md1Через Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-vector -a gemini-cli2Командой платформы
gemini skills install https://github.com/ZhangHanDong/makepad-skills --path skills/makepad-2.0-vectorВручную: положить файлы
.devin/skills/makepad-2.0-vector/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-vector -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о makepad-2.0-vector
Как установить makepad-2.0-vector в Claude Code?
Выполните в терминале команду npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-vector -a claude-code.
Что делает makepad-2.0-vector?
Он передаёт ИИ точный синтаксис виджета Vector фреймворка Makepad 2.0 для описания шейпов, градиентов и свойств переходов.
Почему для заливки и обводки нельзя использовать draw_bg?
Фигуры внутри Vector обрабатывают только SVG-параметры fill, stroke и stroke_width. Попытка задать draw_bg.fill_color или draw_bg.stroke_width игнорируется движком.