From our monthly sponsor: Create your beautiful portfolio website with Squarespace. Start your free trial.
Today we’d like to share some fun little hover effects with you. The idea is to show a preview animation for folders. The animations are intended as a fun micro-interaction that give the user some kind of hint of what’s inside the hovered folder. We are using anime.js to power the animations.
Have a look at some of the final states of the hover animations:
We hope you enjoy this tiny set and find it inspiring!
References and Credits
- Anime.js by Julian Garnier
- Charming.js by Yuan Qing
- Images designs by Freepik.com: People Avantars, Set of three field banners with trees, Beautiful hand drawn landscapes nature banners, Flat cityscape pack, Set of banners with mountains
- Folder user icon by Madebyoliver, Ineraction Asset
- Planet icon by Designerz Base
- Padlock icon by Freepik
- Cloud icon by Gregor Cresnar