Docs

What it is

Each figure sits at a desk. The torso is a filled ink mass. A paper face overlaps it. A drink sits between two rounded hands. A prop keeps the desk from going empty. Hair, drink, and prop are the only things that change — enough to read as different people, still one set.

The original sheet was six figures. This pack expands that grammar into one hundred named combinations without adding a second style.

Three rules

1. Mass, not outline. No neck, no contour around the body. The chin is the overlap of face on torso.
2. The line boil. An feTurbulence seed flips eight times a second. Do not replace it with extra outline jitter.
3. Two features. Nose and mouth. No eyes. They are looking at the cup.

Color tokens

Every file uses three hexes. Recolor by replacing them. The playground does that live; you can do it in a text editor.

• Paper#F4F2ECbackground, face, cups, hands
• Ink#12100Ebody, hair, strokes, desk
• Accent#F2C744sticky notes, a few props

File names

001-fauxhawk-iced-camera.svg is {n}-{hair}-{drink}-{prop}. Seventeen haircuts, six drinks, thirty-three props. Not a full cartesian product — one hundred chosen seats at the same desk.

Drop it in

Inline the SVG when you need to recolor or respect reduced motion from CSS already in the file. Use an img when you only need the drawing. Hold a loading curtain a beat so a warm cache does not flash it.

<img
  src="/cast/001-fauxhawk-iced-camera.svg"
  alt="Desk character waiting with an iced drink"
  width="660"
  height="432"
/>

Recolor, copy, and download from the playground.

Motion

Each file already wraps breathe, steam, and the boil in @media (prefers-reduced-motion: reduce). Do not add a second animation layer on top unless you honor the same query.

Prompts

The playground prompt restates the three rules, the hair / drink / prop, and the current hexes. Paste it into an image or code model when you want another figure in this grammar, not a different style. The copied SVG is the source of truth for the figure on screen.