CODEWITHSUNDEEP
javascriptthree.jsgammasrgb
Forepick
Forepick

Reputation: 937

THREE.js: Textures become grayish with renderer.OutputEncoding = sRGBEncoding

I'm playing a bit with the Three.js cloth example but instead of the alphaMap, I kept the cloth-plane fully opaque and changed its color map. The result is quite disappointing as the texture now renders very grayish due to the OutputEncoding of the renderer (sRGB Encoding). If I change the output encoding back to LinearEncoding, the grass texture appears to be too dark.

Below is the result: enter image description here

And the original textures look like this:

enter image description here

Is there any way to remain with the sRGBEncoding but have my cloth texture render with much more contrast?

Upvotes: 3

Views: 1867

Answers (1)

Mugen87
Mugen87

Reputation: 31026

Is there any way to remain with the sRGBEncoding but have my cloth texture render with much more contrast?

Yes. Just set the encoding property of your texture to THREE.sRGBEncoding.

The default encoding value of textures is THREE.LinearEncoding. So if you don't modify it but a configure a sRGB workflow on renderer level, color textures will indeed look incorrect.

Upvotes: 3

Related Questions