A motion study2026

Motion.

Four small studies in the kind of motion I actually reach for — held together by a single rule: every animation has to earn the milliseconds it takes.

Magnetic.

A button that's gently pulled toward the cursor when it nears. Easing on entry, an elastic reset on exit — same easing curve as a held breath.

Counter.

A number that arrives the way numbers should: quickly at first, then settling. Eased on the last third so the final digits feel chosen, not thrown.

Page views this morning

Marquee.

Four lines, looping. Slow by default, faster on hover — the page meets the cursor's interest. Pure CSS, no library.

Form follows feelingType does the heavy liftingMotion that earns the millisecondsQuiet beats loudForm follows feelingType does the heavy liftingMotion that earns the millisecondsQuiet beats loudForm follows feelingType does the heavy liftingMotion that earns the millisecondsQuiet beats loudForm follows feelingType does the heavy liftingMotion that earns the millisecondsQuiet beats loud

Trace.

An SVG path drawing itself as you scroll past, using native animation-timeline: view(). The browser does the work; the markup stays clean.

The best motion is the one you don’t notice the second time through.

Back to the index