# Issue with SRGBColorSpace output after upgrade (r164)

**URL:** <https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217>\
**Category:** Questions\
**Tags:** tone-mapping, webglrendertarget, webgl-renderer, color-space\
**Created:** [May 30, 2024, 11:02pm UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217 "2024-05-30T23:02:33Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![taseenb](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/taseenb/32/480_2.png) [@taseenb](https://discourse.threejs.org/u/taseenb)\
**Post date:** [May 30, 2024, 11:02pm UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/1 "2024-05-30T23:02:33Z")

</div>

Hello

After upgrading to revision 164 (from 132) I got some expected issues related to lighting and colours that I could fix.

But after setting the `outputColorSpace` to `SRGBColorSpace` as recommended, the rendering quality of the materials changed. The triangles of the geometry are now visible and not smoothed as expected. And if I change the `outputColorSpace` to `LinearSRGBColorSpace` (which is NOT recommended) the triangles go away.

This is the rendering with r132 (GOOD)

 ![Screenshot 2024-05-30 at 19.31.06](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/d/0/d04152b325d758bee4f3f304a7c941fdbfea7b97.jpeg)

This is the rendering with r164 (BAD)

 ![Screenshot 2024-05-30 at 19.32.40](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/8/4/8453ae0e67c2939b41cd9d8343b4ee03bdf8eeec.png)  
 ![Screenshot 2024-05-30 at 19.30.58](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/3/e/3eddc95d390e7a9c76eefe72667b42ffd2d5a8e1.jpeg)

And this is r164 with `renderer.outputColorSpace = THREE.LinearSRGBColorSpace` (no defects but BAD COLOR!)

 ![Screenshot 2024-05-30 at 20.04.46](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/c/6/c6b5afcbbe2b60794efa4b7ea9c3839bc9846030.jpeg)

The model and the texture are identical. Lights have been changed a bit but everything else has not changed. Any idea on what can cause this issue and how to fix it?

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [May 31, 2024, 2:16am UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/2 "2024-05-31T02:16:19Z")

</div>

That’s a strange result! In general the color space change tends to produce less harsh lighting, such that people sometimes need to add a bit more contrast in afterward, so I’m surprised your app went the opposite way. The visible triangles are unexpected too.

1. Can you see the same result on another device and/or browser?
2. Is it possible to share a demo before and after?
3. Are you using post-processing (EffectComposer) anywhere, and, are you using any tone mapping, and if so which one?

---

<div class="post-metadata">

**Author:** ![dubois](https://avatars.discourse-cdn.com/v4/letter/d/e9c0ed/32.png) [@dubois](https://discourse.threejs.org/u/dubois)\
**Post date:** [May 31, 2024, 2:21am UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/3 "2024-05-31T02:21:35Z")

</div>

Do you have normal maps?

---

<div class="post-metadata">

**Author:** ![taseenb](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/taseenb/32/480_2.png) [@taseenb](https://discourse.threejs.org/u/taseenb)\
**Post date:** [May 31, 2024, 5:50pm UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/4 "2024-05-31T17:50:48Z")

</div>

Thanks a lot for the suggestions, that was helpful and I could find the solution.

The problem was that I was setting the color space for the `normalMap`, `metalnessMap` and `roughnessMap` to `SRGBColorSpace`.

By using `NoColorSpace` the issue disappeared. The color map should remain `SRGBColorSpace`.

---

<div class="post-metadata">

**Author:** ![taseenb](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/taseenb/32/480_2.png) [@taseenb](https://discourse.threejs.org/u/taseenb)\
**Post date:** [May 31, 2024, 6:41pm UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/5 "2024-05-31T18:41:26Z")

</div>

One note @drcmda

Is it possible that the color space gets changed/forced automatically to `SRGBColorSpace` when a texture previously created gets applied to an existing material in React Three Fiber? Wondering if this may happen because the `NoColorSpace` is a falsy value (empty string) so it could be turned into a default somewhere in Three.

I don’t have a proper test to prove this but this happens in my app so I need to force it every time in the update function of the material.

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [May 31, 2024, 6:56pm UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/6 "2024-05-31T18:56:29Z")

</div>

three.js defaults new textures to NoColorSpace, R3F defaults to SRGBColorSpace. I’m not sure at what point in the texture lifecycle that happens exactly in R3F, but the behavior will change in upcoming R3F v9 and match the three.js defaults (see [[v9] fix!: don't automatically set texture colorSpace, colorMap fallback by CodyJasonBennett · Pull Request #3163 · pmndrs/react-three-fiber · GitHub](https://github.com/pmndrs/react-three-fiber/pull/3163)).

In either case — it is probably a good best practice to assign each texture a color space explicitly, thinking about whether it is “color” or “data”. If data, always use NoColorSpace. If color, use SRGBColorSpace for PNG and JPG textures, or LinearSRGBColorSpace for HDR and EXR textures, unless you are _very_ sure your textures were authored differently.

---

<div class="post-metadata">

**Author:** ![taseenb](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/taseenb/32/480_2.png) [@taseenb](https://discourse.threejs.org/u/taseenb)\
**Post date:** [May 31, 2024, 7:05pm UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/7 "2024-05-31T19:05:48Z")

</div>

Good to know thanks!

---

<div class="post-metadata">

**Author:** ![dubois](https://avatars.discourse-cdn.com/v4/letter/d/e9c0ed/32.png) [@dubois](https://discourse.threejs.org/u/dubois)\
**Post date:** [June 1, 2024, 8:34am UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/8 "2024-06-01T08:34:17Z")

</div>

Credit goes to me right? I knew what it was at first glance? I’m unemployed, poor, and was once banned from here, would really appreciate some validation \<3

I’m also super curious to see this normal map, the mesh itself looks pretty high res (the filleted edges for example) yet the normal map seems like it was possibly baked?

---

<div class="post-metadata">

**Author:** ![dubois](https://avatars.discourse-cdn.com/v4/letter/d/e9c0ed/32.png) [@dubois](https://discourse.threejs.org/u/dubois)\
**Post date:** [June 1, 2024, 8:40am UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/9 "2024-06-01T08:40:40Z")

</div>

I lived through the era when “linear workflow” was introduced for 3d applications and GI.

It was extremely confusing to say the least.

---

<div class="post-metadata">

**Author:** ![taseenb](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/taseenb/32/480_2.png) [@taseenb](https://discourse.threejs.org/u/taseenb)\
**Post date:** [June 1, 2024, 6:06pm UTC](https://discourse.threejs.org/t/issue-with-srgbcolorspace-output-after-upgrade-r164/66217/10 "2024-06-01T18:06:14Z")

</div>

Yeah thanks mate:) The normal map is nothing special, just an image with a single color.

The material was originally ported from Adobe Substance. That is where the idea of using those plain color maps came from. I think the same effect can be achieved tweaking Three StandardMaterial settings though. That’s just the way AS obtains the glossy look of the acetate material.