Three.js Shaders & Materials

Every shader here was built in Shaderfrog and runs in Three.js. Click one to open it in the editor, where you can edit the GLSL, rewire the node graph, and export the result as a Three.js material.

Shaderfrog shaders compose: you can plug a noise shader into a fire shader, or a vertex displacement shader into the position of a MeshPhysicalMaterial. Many are built on the standard Three.js materials, with custom code plugged into their color, normal, and roughness. See how Shaderfrog works.

583 Three.js Shaders & Materials

0 0
Lava Lump screenshot
Three
0 0
Phlaigm Belch screenshot
0 0
Grunting Moon screenshot
0 0
Bacterial Cubes screenshot
0 0
Matrix Galaxy screenshot
0 0
Perlin's Spiral screenshot
0 0
Lava screenshot
Three
0 0
Oil or Fire screenshot
Three
0 0
Wavy Plastic screenshot
0 0
Wiggly Effect screenshot
0 0
Oil Painting screenshot
0 0
Vignette screenshot
Three
0 0
Ice Cream Drip screenshot
0 0
Oil Painting screenshot
0 0
Glowing dots screenshot
0 1
Kaleidoscope screenshot
0 0
Checkerboard screenshot
0 0
Blorg Cube screenshot
Three
0 0
Magnus Mangus screenshot
0 0
Radar screenshot
Three
0 1
Star Field screenshot
Three
0 0
Eyeball Texture screenshot
0 0
Pixellation screenshot
Three
0 0
Strange Water screenshot
0 0
Ripples screenshot
Three
0 0
Wiggly Improved screenshot
0 0
Mandelbrot screenshot
Three
0 0
Twister! screenshot
Three
0 0
Polkadots screenshot
Three
0 0
Big Wiggles screenshot
Three
0 0
Rotate Me! screenshot
Three
0 0
Borg Hull screenshot
Three
0 0
Pixelated screenshot
Three
0 0
Circuit Grid screenshot