hairline-adopt — скилл для Claude Code: что делает и как установить
Пересобирает иконку или логотип из SVG в изометрическую линейную фигуру на движке @lucasmarkes/hairline, которая реагирует на указатель.
npx skills add lucasmarkes/hairline --skill hairline-adopt -a claude-codeЧто делает hairline-adopt
Скилл берёт один SVG — иконку, логотип, иллюстрацию — и пересобирает нарисованный объект заново: телами на движке @lucasmarkes/hairline, в изометрии, одними линиями. Исходный файл он не анимирует и не обводит. Рисунок задаёт, что это за предмет и из каких частей он состоит, а фигура строится с нуля с теми же пропорциями.
Работа устроена как передача эстафеты: скилл вызывает /hairline-create, отдав путь к файлу и, если человек сказал, описание жеста, который должен отвечать на указатель. Шаг 0 читает рисунок и фиксирует объект и его части. Дальше варианты отличаются жестом либо, когда жест задан, формой и выводом. Построение, проверка и сдача остаются за вызванным скиллом.
Что нужно заранее: файл .svg. Если файлов несколько, фигура делается по одной, и скилл спросит, с какой начать. Жест можно не описывать: тогда его предложат варианты. Перед сборкой скилл одной строкой говорит, чем он прочитал рисунок и какие части сохранил; неверное прочтение правят до того, как что-то построено. Чужая марка на готовой странице — повод спросить владельца, а не решать самому.
Какие задачи решает
- оживить готовую иконку из макета, не перерисовывая её вручную
- собрать изометрическую фигуру по плоскому логотипу
- добавить реакцию на наведение курсора к статичному SVG
- выбрать, с какого файла начать, когда SVG в папке несколько
- заметить чужую торговую марку до того, как фигура уедет на страницу
Примеры запросов агенту
/hairline-adopt public/logo.svg/hairline-adopt assets/icon.svgфигура поворачивается к курсору/hairline-adopt hero.svg— при наведении фигура чуть наклоняется за указателем
Как установить hairline-adopt
1Через Skills CLI (Vercel)
npx skills add lucasmarkes/hairline --skill hairline-adopt -a claude-code2Вручную: положить файлы
~/.claude/skills/hairline-adopt/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/hairline-adopt/
1Через Skills CLI (Vercel)
npx skills add lucasmarkes/hairline --skill hairline-adopt -a codex2Вручную: положить файлы
.agents/skills/hairline-adopt/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add lucasmarkes/hairline --skill hairline-adopt -a cursor2Вручную: положить файлы
.cursor/skills/hairline-adopt/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install lucasmarkes/hairline hairline-adopt2Вручную: положить файлы
.github/skills/hairline-adopt/SKILL.md1Через Skills CLI (Vercel)
npx skills add lucasmarkes/hairline --skill hairline-adopt -a gemini-cli2Командой платформы
gemini skills install https://github.com/lucasmarkes/hairline --path skills/hairline-adoptВручную: положить файлы
.devin/skills/hairline-adopt/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add lucasmarkes/hairline --skill hairline-adopt -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о hairline-adopt
Как установить hairline-adopt в Claude Code?
Выполните npx skills add lucasmarkes/hairline --skill hairline-adopt -a claude-code. Скилл окажется в ~/.claude/skills/hairline-adopt/SKILL.md.
Что делает hairline-adopt?
Читает SVG и пересобирает изображённый объект как изометрическую линейную фигуру на движке @lucasmarkes/hairline, добавляя жест в ответ на указатель. Сам рисунок не анимируется и не трассируется.
Что нужно дать скиллу для работы?
Один файл .svg. Жест можно описать словами, но это не обязательно: без описания его предложат варианты. Если файлов несколько, скилл спросит, какой брать первым, и сделает по одной фигуре за раз.
Исходный текст
SKILL.md · MIT
--- name: hairline-adopt description: Use when someone has an SVG (an icon, a logo, an illustration) and wants it as a Hairline figure, or runs /hairline-adopt with a file. Reads the drawing, rebuilds its object as an isometric line figure on the engine of @lucasmarkes/hairline, and gives it a gesture that answers the pointer. argument-hint: "<file.svg> [what the pointer does]" --- # Hairline: adopt a drawing The person has a drawing and wants it alive, as a Hairline figure. This skill reads the drawing, rebuilds its object as solids on Hairline's engine, and gives it a gesture. It never animates the SVG itself, and it never traces it: the drawing gives the identity, and the figure is built new, with its proportions and its parts. ## What it needs - One `.svg` file: an icon, a logo, an illustration. Given several, make one figure at a time: ask which comes first. - Optionally, what the pointer should do to it. Without it, the concepts propose the gesture. ## What to do Invoke `/hairline-create` with the file's path and, after it, whatever the person said about the gesture, in their words. Its step 0 reads the drawing and fixes the object and its parts; its concepts then keep them and differ in the gesture, or, when the gesture was given, in the form and the read-out. Everything after that, the build, the check and the hand-over, is that skill's. ## What to say When you offer the concepts, say first, in one line, what you read the drawing as and which of its parts you kept. If the person corrects the reading, read it again their way before any concept is built. If the drawing is a mark that belongs to someone else, say so at hand-over: the page shows another company's mark, and it is theirs to publish or not.
© lucasmarkes · MIT · lucasmarkes/hairline