Easily compare Webflow's built-in easing options

Community resources Webflow Tips
1

Do you know your ‘In Quad’ from your ‘In Quint’ when it comes to Webflow’s built-in easing options? I certainly don’t and always struggled to compare & choose the right one as there is no way to preview them in the easing mode drop down. I made this tool to preview them all, side by side for common use cases I encounter (sliding panels, rotating and fading things):

It’s really been helping me to find the perfect easing for a given situation. Hope you find it useful too.

If this is something you care about I added a wishlist request for a small preview like this inside the easing mode drop down itself to make comparing and choosing the modes even easier: Preview of default easing modes inside the easing | Webflow Wishlist

If you have any feedback, I’m all👂s. Thank you.

2

This is really cool! Thank you for taking the time to put this together!

The only feedback I’d give right now is to maybe change so that the interactions only play on hover or click, just in consideration of our more motion-sensitive users.

1 Like
3

Hey @ColemanChrisB , thanks for pointing that out! :+1:

1 Like