Internal tool · noindex
Rabbit playground
The animated icon (ADR 009), driven by the site's own code in src/scripts/rabbit/. Trigger, slow down and scrub the movements, tune the values, then copy them into rig.ts.
Lab
Click a rabbit to make it duck. The eyes follow the mouse. Nothing moves on its own here. The 404 page's rabbit searches from inside the hat and stays there afterwards; "Pop up" brings it out, also in the middle of a search.
On light
On dark
Movements
Tuning
TUNING from rig.ts, live (depths and gaps in viewBox units; the icon is 40 × 48). Changes apply to every rabbit on this page and are gone when you leave it. Idle intervals and delays (EVERY in element.ts) aren't here.
How far the eyes slide sideways
Between the rabbit and the rim behind it, just below the brim
The same gap with the rabbit far inside
Rabbit depth where the gap starts to change
Depth where it reaches “Gap when deep”
Depth where the hat's back rim starts to show
Depth where it is fully there
Depth with only the ears out (rise and search)
Depth where the eyes just clear the brim (search)
How far the ears flop outward in the search's shrug, degrees
Turns of the reflection; the spin gets longer with each
Largest motion blur of the reflection; 0 turns it off
export const TUNING: Tuning = {
lookMax: 3,
gapAtBrim: 1.4,
gapDeep: 0.6,
gapGrow: [0.3, 12],
depthFade: [0.2, 1.8],
hidden: 31,
peekEars: 14,
peekEyes: 1.9,
droop: 16,
spinTurns: 2,
blurMax: 2.5,
}; As on the site
<RabbitMark> as the Home hero uses it: rises when it comes into view, then blinks, winks, twitches, glances, tilts and spins on its own, follows the mouse and ducks on click. Static with reduced motion. The third is the 404 page's (lost): it searches from inside the hat and comes out when you click it.
Small sizes
At 48 px and below only blinks and winks; the rest would be too small to see.