Creating custom postprocessing shaders
In this section, you’ll learn how to create a custom shader that you can use in postprocessing. We’ll create two different shaders. The first one will convert the current image to a grayscale image, and the second one will convert the image to an 8-bit image by reducing the number of colors that are available.
Vertex and fragment shaders
Creating vertex and fragment shaders is a very broad subject. In this section, we will only touch the surface of what can be done by these shaders and how they work. For more in-depth information, you can find the WebGL specification at http://www.khronos.org/webgl/. An additional resource, full of examples, is Shadertoy, available at https://www.shadertoy.com, or The Book of Shaders: https://thebookofshaders.com/.
Custom grayscale shader
To create a custom shader for Three.js (and also for other WebGL libraries), you have to create two components: a vertex shader and a fragment shader...