К основному содержанию
скилл CX Codex

hairline-adopt — скилл для Claude Code: что делает и как установить

Пересобирает иконку или логотип из SVG в изометрическую линейную фигуру на движке @lucasmarkes/hairline, которая реагирует на указатель.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add lucasmarkes/hairline --skill hairline-adopt -a claude-code
Открыть на GitHub

Что делает 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-code

2Вручную: положить файлы

~/.claude/skills/hairline-adopt/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/hairline-adopt/

По шагам, с командами для каждой платформы: Как установить скилл в 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

Похожие скиллы

Всё по теме «Дизайн» →
anatomy wheresryan22 Генерирует детальные интерактивные изометрические SVG-иллюстрации в виде физических приборов вместо абстрактных схем. CX Codex +1 21 800установок isometric-animation iart-ai Скилл для изометрических и 2.5D-анимаций: стопки слоёв, выдавленные блоки, взрывные схемы и лёгкий дрейф камеры. Собирается в один HTML-файл без сборки. CX Codex +1 1 400установок isometric-explainer rohitg00 Скилл создаёт интерактивную страницу с изометрической машиной, где каждый узел визуализирует шаг процесса на базе строгой модели состояний. CX Codex +1 550установок build-game-map-editor MengTo Скилл помогает спроектировать браузерный редактор карт для Three.js и изометрических игр. Он настраивает режим режиссёра, черновики и оверлеи без изменения боевых сохранений. CX Codex +1 1 200установок design claudekit Скилл для генерации логотипов, бренд-айдентики, дизайн-токенов, слайдов на Chart.js и баннеров через ИИ и Python-скрипты. CX Codex +1 41 300установок adopt-spec zernie Превращает уже написанный CLAUDE.md или AGENTS.md в типизированный CLAUDE.md.spec.ts, не трогая исходный файл. Пригодится, если хочется проверять инструкции линтером, но переписывать их с нуля неохота. CX Codex +1 1 800установок

Из того же набора2

Спонсоры проекта

Компании, которые помогают держать аналитику открытой