Distorted Link Effects with SVG Filters
by Manoela Ilic
A couple of ideas for decorative link distortion effects using SVG filters on lines, circles and squares.
+ more#hover
Creating a Distorted Mask Effect on an Image with Babylon.js and GLSL
Learn the basics of GLSL while creating a distorted mask effect on images using Babylon.js.
+ more
Making Gooey Image Hover Effects with Three.js
Learn how to create gooey reveal hover effects on images with Three.js using noise within a shader.
+ more
How to Create Motion Hover Effects with Image Distortions using Three.js
In this tutorial you will learn how to achieve interesting looking hover effects with image distortions using Three.js.
+ more
Case Study: Chang Liu Portfolio V4
by Chang Liu
Get insight on how to add 3D to a website using Three.js and make a wavy distortion effect in this case study of Chang Liu's new portfolio.
+ more
Mouse Flowmap Deformation with OGL
A set of WebGL demos using OGL that show an interactive fluid distortion hover effect.
+ more
React Slider with Parallax Hover Effects
Walk through the build of a React slider and learn how to implement a parallax hover effect.
+ more
Animated Image Columns
by Manoela Ilic
An experimental web layout where several image columns get animated out when a menu item is clicked.
+ more
How to Build an Underwater-Style Navigation Using PixiJS
by Liam Egan
A tutorial on how to create a visually distinct and accessible WebGL menu that builds from any given HTML navigation.
+ more
How to Create a Sticky Image Effect with Three.js
A recreation of the sticky image effect seen on the websites of MakeReign and Ultranoir using three.js.
+ more
Image Distortion Effects with SVG Filters
by Manoela Ilic
Three distortion effects powered by SVG filters that are applied to an image when hovering a link.
+ more
Custom Cursor Effects
A collection of five demos and a tutorial on how to create animated custom cursor effects for interactive elements like navigations, galleries and carousels.
+ more
Interactive Repulsion Effect with Three.js
by Ion D. Filho
A tutorial on how to recreate the interactive repulsion effect of grid items seen in BestServedBold's Dribbble shot "Holographic-Interactions".
+ more
Image Reveal Hover Effects
by Manoela Ilic
A set of link hover effects that reveal a thumbnail in different creative ways.
+ more
Fullscreen Hover Loop Effect
by Manoela Ilic
A fullscreen loop effect that shows a fast preview of images when hovering a special menu item.
+ more
Grid Layout with Motion Hover Effect and Content Preview
by Manoela Ilic
A retro-style grid layout with a playful motion hover effect on the grid items. When clicking on a grid item, a content preview opens.
+ more
Ideas for Proximity Feedback with Progressive Hover Effects
by Manoela Ilic
We're exploring a progressive hover effect which triggers not just when we are hovering an element but progressively, when we come close to it.
+ more
WebGL Distortion Hover Effects
A little library that can be used for creating WebGL powered distortion hover effects using displacement images.
+ more