Hover effect like Hello Monday

[crawlers]

Hello First of all I love all your work.
I want to add hover effect like one of your project https://www.hellomonday.com/
Can anyone please help me in this that how can we achieve this 
Thanks

[ZachSaucier]

Hey crawlers, welcome to the GreenSock forums.

 

We didn't make that site - it's in our showcase because we know that they have used GSAP in their webpage. 

 

I assume the hover effect you're wanting is the liquid border effect for the projects? That effect is created with WebGL and is not the easiest to recreate if you don't understand shaders. You could look into curtains.js to help. Or perhaps the WebGL tag on Codrops.

[akapowl]

Hey @crawlers

 

I was basically just about to say the same as @ZachSaucier

I think the effect on that website is created with the help of Pixi.js - but you could also use other libraries for that, like three.js.

 

If you wanna learn more about how to get there, you could check out this neat tutorial on Codrops on how to creat similar effects with three.js.

 

https://tympanus.net/codrops/2019/10/23/making-gooey-image-hover-effects-with-three-js/

 

Cheers.