Interactive WebGL Jersey Slider Blends Team Kits in 3D Prity Dhara’s Three.js jersey slider uses one 3D model, shader-based texture transitions, fabric movement, and GSAP motion to make kit changes feel physical.
22.09.2000 He Was Born Runs a Portfolio Through a WebGL TV LUCERRÁ's WebGL portfolio behaves like one CRT broadcast, using texture layers, live 3D render targets, glitch transitions, hand tracking, and adaptive quality.
Particles Cursor Turns Images Into a Shader Field Gabriel Villanueva’s Three.js experiment turns images into particle grids that react to cursor movement through GLSL displacement, texture color, and real-time controls.
A Project Gallery That Bends Like Film A row of project cards behaves like a strip of film you can scroll, flex, and shove around with your cursor. Built in Three.js with hand-written GLSL, where scroll velocity drives a vertex-shader bend and a post-process pass adds the grainy, almost celluloid edge shimmer.
Smooothy: A Slider Built to Sit Under Your WebGL Scene Federico Valla's Smooothy is a tiny TypeScript slider that exists because every other carousel synced badly with WebGL. Drag through Toast and Fish but no Head while current, target, and parallaxValues tick out in real time, ready to feed your shader uniforms.
Weisdevice: A Glitchy Three.js Island With a Playable DJ Deck Wei's portfolio drops you on a tiny island with a half-broken robot, a Gameboy, and a DJ deck that refuses to play clean loops. Three.js with GLSL and GSAP up top, smart performance choices underneath: raycasting at 30 FPS, render loop paused on inactive views, assets tiny and lazy-loaded.
BlueYard: A Two-Color WebGL Atlas by Unseen Studio Unseen Studio rebuilt BlueYard around Buckminster Fuller, a fluid-simulated orb, and a beautiful color palette. Three.js under the hood, reactive cursor, four thematic zones to scroll through. Worth opening devtools on.
A Paper Tear, a Hand-Drawn Corridor, and Sketches That Finish Themselves A sheet of paper rips open and drops you into a hand-drawn corridor where pencil-sketched frames paint themselves in as you walk up to them. The kind of small site that rewards a slow look around.
Hydra: A Livecoded Video Synth Built on WebGL Framebuffers Olivia Jack's Hydra turns the browser into a modular video synth. Chain oscillators, kaleidoscopes, and webcam feeds into recursive GLSL patches, then pipe the output to another browser over WebRTC. Type a function, hit Ctrl+Enter, watch the pixels misbehave.
Find Your Way to Oz: The 2013 Chrome Experiment UNIT9 built a full Kansas carnival in WebGL for Disney, then destroyed it with a tornado shader borrowed from neuroscience. No physics engine. No framework. Just clever faking, spatial audio, and a three-month deadline. The source is open.
Penderecki's Garden: A Point-Cloud Memorial Built Using Photogrammetry Huncwot turned billions of drone-captured particles into a navigable WebGL garden for composer Krzysztof Penderecki. Custom GLSL shaders breathe with the music. Fully keyboard-accessible. One of the most ambitious Three.js projects we've seen.
Earthquake Pulse Map: A Century of Seismic Activity on a WebGL Globe A Three.js globe plotting 120+ years of major earthquakes with custom GLSL shaders, binary-packed data, and live USGS feeds. Spin, zoom, and scrub through time. The tectonic boundaries light up whether you're ready or not.
Kiomet: A Real-Time Multiplayer Strategy Game Built With Rust and WebGL Kiomet drops you into a live hex-grid battlefield with dozens of players, 27 tower types, and zero installs. The whole stack is Rust compiled to WebAssembly, rendered through WebGL with custom GLSL shaders. Open source and running in a browser tab.
gpu-curtains: A WebGPU 3D Engine That Syncs Shaders to Your DOM Martin Laxenaire rebuilt his DOM-to-shader library for WebGPU, and this time it's a full 3D engine. Lights, shadows, compute shaders, glTF support, and the same trick that made curtains.js useful: your HTML elements become shader geometry that scrolls and resizes like native DOM.
In The Clouds: Tallest Buildings as 40-Meter Blocks The world's tallest buildings rendered as stacked 40-meter blocks in Three.js. One block equals four floors. Pure client-side WebGL with procedural geometry. No map tiles, just height data and math.
curtains.js: DOM-Driven WebGL Textured Planes Martin Laxenaire's lightweight WebGL library that converts HTML elements into shader-driven textured planes positioned exactly where your CSS says they should be. Write normal markup, add shaders, skip the coordinate math.
