CommunityImagemgithub.com

parthkapoor15/skill-library

Use quando alguém tem um SVG (um ícone, um logotipo, uma ilustração) e deseja transformá-lo em uma figura Hairline, ou executa /hairline-adopt com um arquivo. Lê o desenho, reconstrói seu objeto como uma figura de linha isométrica no motor de @lucasmarkes/hairline e dá a ele um gesto que responde ao ponteiro.

O que é skill-library?

Este skill permite transformar qualquer desenho SVG (como ícones, logotipos ou ilustrações) em uma figura animada e interativa chamada Hairline, utilizando o motor de @lucasmarkes/hairline. Em vez de simplesmente traçar ou animar o SVG original, o skill reconstrói o objeto como sólidos isométricos, preservando a identidade, as proporções e as partes do desenho original, e adiciona um gesto que reage ao movimento do ponteiro. Ele é útil para desenvolvedores e designers que desejam dar vida a elementos gráficos de forma programática e criativa. O fluxo começa com a leitura do arquivo SVG e a definição de suas partes, seguido pela construção da figura com base no gesto desejado (ou sugerido automaticamente), e finaliza com a entrega do resultado. O skill suporta os principais agentes de IA como Claude Code e Cursor e segue uma abordagem modular onde o motor Hairline cuida da construção e animação.

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/parthkapoor15/skill-library/tree/HEAD/skills/hairline/hairline-adopt

Installed? Explore more Imagem skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

Hairline: adotar um desenho

A pessoa tem um desenho e quer que ele ganhe vida, como uma figura Hairline. Este skill lê o desenho, reconstrói seu objeto como sólidos no motor do Hairline e dá a ele um gesto. Ele nunca anima o SVG em si, nem o traça: o desenho fornece a identidade, e a figura é construída nova, com suas proporções e suas partes.

O que precisa

  • Um arquivo .svg: um ícone, um logotipo, uma ilustração. Se houver vários, crie uma figura por vez: pergunte qual vem primeiro.
  • Opcionalmente, o que o ponteiro deve fazer com ele. Sem isso, os conceitos propõem o gesto.

O que fazer

Invoque /hairline-create com o caminho do arquivo e, após ele, o que a pessoa disse sobre o gesto, em suas palavras. Seu passo 0 lê o desenho e fixa o objeto e suas partes; seus conceitos então os mantêm e diferem no gesto, ou, quando o gesto foi dado, na forma e na leitura. Tudo depois disso, a construção, a verificação e a entrega, é responsabilidade desse skill.

O que dizer

Quando você oferecer os conceitos, diga primeiro, em uma linha, o que leu do desenho e quais de suas partes manteve. Se a pessoa corrigir a leitura, leia novamente do jeito dela antes de qualquer conceito ser construído.

Se o desenho for uma marca que pertence a outra pessoa, diga isso na entrega: a página mostra a marca de outra empresa, e é decisão dela publicá-la ou não.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

Habilidades Relacionadas