What is ShaderFrog?

Oh, hi there! Welcome to something…new. How about a video?

Let me use it already!


Shader Frog is a WebGL shader editor that lets you design shaders without writing code.

Shader Frog lets you create visual effects by composing two or more shaders together, and tweaking their parameters. You can build a complex effect out of simple components. You can then export your shader for use in your THREE.js game or application.

WebGL is an open standard technology that lets a programmer create a 3d scene in the browser. It can run on Android, iOS, tablet, laptop, desktop, and any device with a modern browser. That means you can write one codebase in Javascript and deploy a 3d applacation to multiple platforms.

Every object you see in a WebGL 3d scene is drawn with a computer program called a shader. Shaders essentially tell the computer how to shade a 3d object. They can create a wide variety of effects, from textures, to animation, to reflection, to procedural noise, and so on.

Shader Frog gives you a repository of user generated shader content, so you have a variety of effects to choose from. With Shader Frog, simply search until you find another shader that you like. Selecting it composes the two shaders together. You can tweak the parameters of the input shaders to create the exact effect that you want. Now you can export this new shader to your 3d game or application.

Learn More

Check out the help pages for more information about ShaderFrog.