# Hairline

> Free MIT library of isometric line figures that react to the pointer (React or any DOM), plus two coding-agent skills: /hairline-create draws a new animated figure from an idea and hairline-adopt starts from your SVG, both following Hairline's ten design rules and outputting one dependency-free HTML file with intensity slider and theme switch. Works with Claude Code, Cursor and Codex.

- **Open:** https://hairline.lucasmarkes.com/skills
- **Type:** tool · **Category:** [Design](https://orphic.adarshji.com/explore/category/design.md)
- **Tags:** claude-skills, animation, ui-components, open-source, claude-code
- **First found:** 2026-11-01 · **Web page:** https://orphic.adarshji.com/explore/hairline

## Use it to

- make a cursor-reactive line animation for a website hero
- animated pricing or feature section from one prompt
- add clean isometric illustrations to a deck or app
- turn an existing svg into an animated figure

## Found in (credit the creator)

- Instagram post by @nick_saraev: https://instagram.com/reel/DemnYE2vTUg (2026-11-01)

## More in Design

- [Three.js](https://orphic.adarshji.com/explore/three-js.md): JavaScript 3D library; as a Claude skill it makes cinematic 3D product commercials, exploded product views and 3D explainers. · tool · https://threejs.org
- [apple-design (Emil Kowalski skills)](https://orphic.adarshji.com/explore/apple-design-emil-kowalski-skills.md): Claude skill from Emil Kowalski's skills repo that applies Apple's WWDC motion principles to the web: springs, instant response, gesture… · repo · https://github.com/emilkowalski/skills/tree/main/skills/apple-design
- [apple-design-skill (dickwu)](https://orphic.adarshji.com/explore/apple-design-skill-dickwu.md): Cross-platform UI/UX design reviewer skill based on Apple's Human Interface Guidelines; works with Flutter, Tauri, Electron, React Native,… · repo · https://github.com/dickwu/apple-design-skill
- [Apple-standard design skills for Claude guide (@jesserurka)](https://orphic.adarshji.com/explore/apple-standard-design-skills-for-claude-guide-jesserurka.md): Notion guide covering two Claude skills that make Claude follow Apple's published design rules, with install steps, a rename fix for the… · resource · https://orphic.adarshji.com/explore/apple-standard-design-skills-for-claude-guide-jesserurka/files
- [Bible Strong Avatar Lab](https://orphic.adarshji.com/explore/bible-strong-avatar-lab.md): Free open-source browser studio (AGPL-3.0) for procedural 2D avatars: build a character from 3D-inspired shapes, design expressions and… · repo · https://github.com/smontlouis/bible-strong-avatar-lab
- All of them: https://orphic.adarshji.com/explore/category/design.md

Up: [Design](https://orphic.adarshji.com/explore/category/design.md) · [All categories](https://orphic.adarshji.com/explore.md) · [Start here](https://orphic.adarshji.com/llms.txt)
