Fluted glass effect for web with custom ThreeJS WebGL shader

[@yannyimo]

Very nice dude! Thanks!!

[@rimbodesigns]

Oooeh love the effect hope I'll land a project in which this effect fits

[@FloNocode]

Very awesome ! So juge effect, i love it thanks for your explanations

[@thelazygod]

Thanks! I'm glad you like it 🔥

[@joergfrank]

Really awesome. Was searching for this a long time :)

[@thelazygod]

Thanks! I've also been working on this for a very long time ✨

[@kevynlevine]

This is great thank you! Is there a way to have a mouse interaction that scales the effect up and down from 0 so if mouse is all the way left on image it’s normal and as mouse goes right the effect turns on and gets more intense?

[@thelazygod]

Thanks! I haven’t built that interaction into the shader, but may look into this in the future 🤔
At the moment you could create an interaction which changes the opacity of the entire canvas container on hover or mouse movement.

[@John-Kappa]

Awesome. Do you know if this can be applied with Framer sites?

[@thelazygod]

I believe that it shouldn’t be an issue to use this in Framer. You just need to be able to add attributes to elements and set up the basic structure of a box (div) with an image inside such as: