Menu

A Playful Clip Menu with GSAP’s easeReverse | Codrops
📰

A Playful Clip Menu with GSAP’s easeReverse | Codrops

Codrops·Manoela Ilic·6 months ago
#uWWz6mkb
#gsap#clippath#menu#casestudies#easereverse
Reading 0:00
15s threshold

A playful GSAP menu demo exploring how easeReverse makes reversed UI animations feel smoother, snappier, and more intentional.

clip-path GSAP menu

Some days ago, the GSAP team released an update which introduced a small but very handy addition for reversible animations: easeReverse .

The idea is straightforward: when you reverse a GSAP animation, the easing curve is reversed too. That often makes technical sense, but visually it can feel off. An ease-out animation played backwards becomes an ease-in , which means a UI element that entered smoothly might feel a bit sluggish or awkward when dismissed.

With easeReverse , we can give the reverse direction its own easing behavior. It can reuse the forward ease adaptively, or it can use a completely different ease.…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.