Hi all! I’m trying to make my scenes look exactly the same with and without post-processing, as I need to match the exact sRGB hexadecimal values and transparencies the design team gives me. I’ve managed to make almost everything work correctly, but I have a huge problem with the objects which hav…

You’re only seeing this problem for transparent materials, right? If it’s affecting opaque materials too, it’s a different issue than I’ll describe below. I believe the difference you’re seeing here is that by default, three.js does blending in sRGB space. With post-processing enabled, blending occ…

@donmccurdy Yes, all the rest of materials are perfectly fine, only happens with the transparent ones. I’ve tried your suggestion but with that combination I get a WebGL error, I’ve tried a different type and the error goes away but I still see the wrong color, here is how I create the EffectCompos…

Hm, this looks correct to me. Would it be possible to create a simple demo, perhaps with just the cube in your screenshot?

@donmccurdy Sure, took me my quite some time but I think I managed to replicate it in a working minimal codepen simulating most of my setup :slight_smile: First a little explanation: The codepen has two scenes, the one called graphScene is the one intended to be affected by post-processing (thoug…

My apologies, it seems I was incorrect about how WebGL does blending in an sRGB framebuffer. :frowning: I’d assumed it would do blending in sRGB, like the drawing buffer does when not using post-processing, but it turns out to decode to Linear-sRGB first, then do blending, then encode back to sRGB.…

@donmccurdy Thx a lot for all your insights, I think I finally understand it. Correct me if I’m wrong, basically when using ‘normal’ render the colorspace_fragment in each built-in shader gets executed for all materials, if your renderer is set with outputColorSpace=THREE.SRGBColorSpace then the sR…

You’re correct in your description of what’s happening in the direct and post-processed rendering pipelines, perhaps except for the “expected sRGB result” vs. “messed up” descriptors. Blending in sRGB is generally incorrect in a lit render pipeline — but it’s impossible to fix that without post-proc…

@electric.cicada if your issue is happening only with transparency (alpha blending) enabled then it might be the same. Since your demo appears to use custom shaders everywhere, you could try explicitly doing a linear-srgb to srgb conversion at the end of the fragment shader, rather than including th…

[image] kikedao: I’m using THREE.ColorManagement.enabled = true; and renderer.outputColorSpace = THREE.SRGBColorSpace; as recommended in the color management guide (which by the way I need to be set exactly like that so the colors are correctly represented from their hex values in the other scen…

Wrong colors in transparent materials when using EffectComposer (post-processing)

Questions

electric.cicada September 20, 2024, 8:33am 7

Hi, could this be the same issue as I’m experiencing in this thread?

Topic		Replies	Views
Transparency blending difference with/without EffectComposer Questions lighting , transparency , effect-composer , blending , color-space	2	188	July 8, 2025
Color Management - Slight color differences when using EffectComposer r152 Questions effect-composer , color-space	3	1391	May 20, 2023
Weird EffectComposer result Questions effect-composer	12	483	October 13, 2024
Color management and post-processing confusion - need help Questions post-processing , color-space	7	1124	January 7, 2025
Subtle colour banding issue, looks like 256 colours when using Bloom with Effect Composer Questions post-processing	16	2719	June 21, 2023

Wrong colors in transparent materials when using EffectComposer (post-processing)

Related topics