v0.9.0
design / Motion

Motion

Every transition animates opacity, transform or a color; nothing animates

v0.9.0 07 / 09 1 min read docs/DESIGN.md
WhereWhatNotes
.risethe hero copy entering, staggered0.7s, --d steps of 70ms
.rvscroll reveals for the rest of the pageonce, 12px up, marked only when JavaScript runs
[data-count]the four numbers counting up900ms, ease-out
.curthe terminal cursor blocksteps(1), 1.06s
#reelthe product window: scenes crossfading with a progress lineone scene every 5.2s; pauses on hover, focus and off screen
.win-cmdthe command typed under the window32ms per character
.nzthe page clutter struck out and collapsed300ms between pieces
.head-nav a::afterthe active underline sliding in0.28s
.progressreading position on the header edgetransform only, no layout
.pal-boxdialogs entering0.18s
view transitionpage change90ms out, 200ms in

Every transition animates opacity, transform or a color; nothing animates layout except the collapse of the clutter in .vs.