WebGL Color Interpolation

If you are drawing using gl.TRIANGLE, then color interpolation will occur after processing 3 vertices from the vertex shader.

Example:

  • We start with 3 vertices represented by values in a buffer.
  • Clip space coordinates are output by the vertex shader.
  • The vertex shader will write to a varying for each vertex.
  • Once all 3 vertices are processed, there will be 3 different varyings which can be used to interpolate pixel colors between the vertices.
  • The fragment shader will interpolate these colors between the vertices by setting gl_FragColor.