Cursor Light Trail Effect in Figma | Step-by-Step Tutorial
15.3K views · 2024-06-28
UI DesignInteraction & UX
☕️ Any support is appreciated! - https://buymeacoffee.com/designos
🔥 Don't forget to like, subscribe, and hit the bell icon to stay updated with more design tips and tutorials. Let us know in the comments what other tutorials you’d like to see!
🏘️Figma Community File - https://www.figma.com/community/file/1388598243837282674/cursor-following-trail-for-web-blur-grid
Other Link -
🧑💻Working Code - https://codepen.io/the-designos/pen/MWddvbq
🌐Cool Anime Example - https://codepen.io/yudizsolutions/pen/ExOaLxx?editors=0010
In today's tutorial, we show you how to create a mesmerizing cursor light trail effect. This effect is perfect for adding a touch of magic to your prototypes and making your interactions more engaging.
Timestamps:
00:00 - Introduction
00:18 - Setup Figma
03:37 - Final Result
03:42 - Create a Grid Effect
04:55 - Grid Final Results
05:00 - Community File, Code and Outro
🔥 Don't forget to like, subscribe, and hit the bell icon to stay updated with more design tips and tutorials. Let us know in the comments what other tutorials you’d like to see!
🏘️Figma Community File - https://www.figma.com/community/file/1388598243837282674/cursor-following-trail-for-web-blur-grid
Other Link -
🧑💻Working Code - https://codepen.io/the-designos/pen/MWddvbq
🌐Cool Anime Example - https://codepen.io/yudizsolutions/pen/ExOaLxx?editors=0010
In today's tutorial, we show you how to create a mesmerizing cursor light trail effect. This effect is perfect for adding a touch of magic to your prototypes and making your interactions more engaging.
Timestamps:
00:00 - Introduction
00:18 - Setup Figma
03:37 - Final Result
03:42 - Create a Grid Effect
04:55 - Grid Final Results
05:00 - Community File, Code and Outro