Free download

Line Figures That Follow The Cursor

A free setup guide for hairline, the open-source library of 33 isometric line figures by Lucas Marques that answer the visitor's pointer: where a figure helps on a landing page, install for React or plain JavaScript, brand colours with six CSS variables, the five options that matter, how to pick the right figure, your own figure with the hairline-create skill, and the honest catches. Plus a tested dark starter page with six figures and six prompts.

The download starts right away; the link also comes by email.

Without the newsletter box you get exactly one email with your link; the address is deleted after 7 days.

What is inside
  • Where it helps Hero, security page, empty states, hardware: which figure fits where.
  • Install + first figure npm or shadcn, then one line of React or plain JavaScript.
  • Your brand Six CSS variables, and the plate colour you must get right.
  • starter/ A tested dark page with six figures, ready to open.
  • PROMPTS.md Six prompts: hero, section picks, empty states, new figure, from your logo, review.
  • Honest catches Version 0.x, fixed objects, plate colour, no hover on phones.

A website project (React, Next.js, Vite, Astro, SvelteKit) or a plain HTML page, Node.js for npm, and a modern browser. The skill needs an agent that reads skills (Claude Code, Cursor, Codex). The guide is in English.

Fabian Faraz Farid · Imprint · Privacy