[SOLVED] The colors in my THREE.JS project are messed up after the update

The colors in my THREE.JS project are messed up after the update

The colors in my project (which use fbx models) are messed up, after updating to version 136. The colors are much darker now. The migration guide stated:

WebGLRenderer.gammaFactor and THREE.GammaEncoding have been removed. Please use post processing (a gamma correction pass) if you need a special gamma color space.

But I have no idea on how to "use post processing (a gamma correction pass)". I would be very thankful if someone give me a simple example on how to fix it.

Solution

I think you just need to set the outputEncoding of your renderer and the encoding of your materials like this:

material.emissiveMap.encoding = THREE.sRGBEncoding;
renderer.outputEncoding = THREE.sRGBEncoding;

(or in a different encoding according to the desired result) https://threejs.org/docs/#api/en/constants/Textures (see the endoding section)