threejs image wave effect
Recreate the webgl image effects on taotajima.jp website using threejs and custom glsl shaders
Ameen Abdullah
Video
Three.js Marketplace
Three.js Marketplace
Kickstart your Three.js and React Three Fiber (R3F) projects with our free and premium components themes and tools. Designed for freelancers, developers, and agencies, each product includes essential features to get you up and running quickly.
Web Development
Help with your project?
Custom Three.js, WebGL, and WebGPU development — from product visualizers to interactive 3D websites.
Links
Featured Badge
Add this badge to your website to show you are featured on Three.js Resources.
Description
Threejs image effect using custom shaders , merging WebGL and html images.
This tutorial covers advanced techniques like wave animations, magnet effects, and scaling on hover, making it perfect for developers looking to elevate their frontend skills with WebGL and Three.js. Includes project boilerplate for hands-on learning.
Sponsors
Related Resources
Glsl Shaders from scratch
GLSL Shaders from Scratch teaches you to create custom shaders, enhancing three.js resources.
Code with Posidoon
"The First Arabic Spoken Course for Three.js" Discover the power of Three.js and begin your journey
React Three Fiber Configurator Course
Learn to create a 3D configurator using Three.js, React Three Fiber, Valtio and Framer Motion.
Threejs Journey
Three.js Journey is a comprehensive course to master three.js and 3D web development.