Creating a Distorted Mask Effect on an Image with Babylon.js and GLSL
In Tutorials by Francesco Michelini
Learn the basics of GLSL while creating a distorted mask effect on images using Babylon.js.
In Tutorials by Francesco Michelini
Learn the basics of GLSL while creating a distorted mask effect on images using Babylon.js.
In Playground by Yuri Artiukh
A set of interesting looking image transitions including distortion and warp effects made with WebGL.
In Tutorials by Arno Di Nunzio
Learn how to create gooey reveal hover effects on images with Three.js using noise within a shader.
In Tutorials by Niccolò Miranda
In this tutorial you will learn how to achieve interesting looking hover effects with image distortions using Three.js.
In Tutorials by Daniel Velasquez
Learn how to achieve a water-like ripple distortion effect with Three.js and postprocessing.
In Playground by Robin Delaporte
A set of WebGL demos using OGL that show an interactive fluid distortion hover effect.
In Playground by Daniel Velasquez
A configurator for creating unique fullscreen image animations with WebGL distortion effects powered by Three.js.
In Tutorials by Daniel Velasquez
Learn how to create thumbnail to fullscreen animations for image grids using Three.js.
A tutorial on how to create a visually distinct and accessible WebGL menu that builds from any given HTML navigation.
In Tutorials by Daniel Velasquez
A recreation of the sticky image effect seen on the websites of MakeReign and Ultranoir using three.js.
In Playground by Manoela Ilic
Three distortion effects powered by SVG filters that are applied to an image when hovering a link.
In Playground by Manoela Ilic
Some text distortion experiments using the Blotter.js library. The idea is to distort text as we scroll or move the mouse.
In Playground by Robin Delaporte
A little library that can be used for creating WebGL powered distortion hover effects using displacement images.
In Playground by Yannis Yannakopoulos
A slideshow with liquid distortion effects in WebGL powered by PixiJS and GSAP.
In Playground by Adrien Denat
A set of inspirational, highly experimental distortion effects for buttons using SVG filters.
In Tutorials by Lucas Bebber
A tutorial on how to use fragment shaders in WebGL to create an animated heat haze distortion effect on images and text.