Happy Monday! Welcome to daily interaction #91.
I saw these animated icons on a website and just had to re-create in Webflow! They're very simple line icons with subtle animations, but I think they're very effective. One thing to note with the shapes that change size is that I used the 'size' animation rather than 'scale,' as scaling adjusts the width of the lines ever so slightly, and doesn't make the animation as precise. Size and move were the only two animations used for these shapes :). The only easing used was 'Ease,' and all the movements have a duration of .5 seconds.
Inspired by this website here: https://versett.com/
To view more daily interactions and premium content visit: https://www.webdevforyou.com/