I have a 8bit sRGB png image that I need to render in my game. I haven’t done this before but I’ve found this example from threejs that does sRGB encoding on a texture + gamma correction. So here is what I’ve done in code:
For the renderer:
renderer.gammaInput = true;
renderer.gammaOutput = true;
renderer.gammaFactor = 2.2;
renderer.outputEncoding = THREE.sRGBEncoding;
For the texture:
lightTexture.encoding = THREE.sRGBEncoding;
And finally add the gamma correction pass to my composer:
const gammaCorrectionPass = new THREE.ShaderPass(GammaCorrectionShader);
But here is the result I get, compared to what I had before in linear color space:
The result is somewhat close to what want except that it gives me these weird color bandings that are similar to a bad image compression. Do you have any idea why?
There has to be a step that I’m missing or overdoing somewhere but after many hours of investigation, I couldn’t get any further than this.
Thanks for your help,