Smoked cursor animation

[kresogalic 0 Likes (Newbie)]

Hey guys, does anyone know how to achieve a cursor follower like this? https://baseone.uk/get-in-touch/

 

It's brilliant animation and really smooth, is it doable with gsap? Thanks in advance

[Sam Tremblay 22 Likes (Newbie)]

Hello @kresogalic!

This cursor is render on <canvas>. You'll need a tool like THREE.js for do that.

 

Put a look on this URL... it's not exacly what you want, but it's close... One thing is sure, it's a good start: https://codesandbox.io/s/water-like-effect-demo-4-iermg?from-embed

 

You can find this CodeSandbox on this tutorial: https://tympanus.net/codrops/2019/10/08/creating-a-water-like-distortion-effect-with-three-js/

 

 

Does help you?

[Rodrigo 5,406 Likes (Superhero)]

Hi,

 

Another options are regular canvas and PIXI. @OSUblake made this examples:

See the Pen MrjqMJ by osublake (@osublake) on CodePen

 

See the Pen RLOzxo by osublake (@osublake) on CodePen

 

Hopefully they serve some inspiration.

 

Happy Tweening!