Post

easing is everything use different CSS timing functions per axis for motion paths 👨‍🍳 .p { animation: x .8s var(--x-time), y .8s var(--y-time); animation-composition: accumulate; 👈 } @​keyframes x { to { translate: var(--x) 0 } @​keyframes y { to { translate: 0 var(--y) }

accumulate is clutch here, really helps keep the control and code clean while doing the right thing

0 reposts4 likes

No replies yet.