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.