Render camera content with transparent skybox to UI RawImage: skybox color peeking through

Hi, I am rendering a camera to a RenderTexture in order to apply post-process (bloom, color grading, etc.) in isolation to the content of this camera. I set its skybox to a solid color with full transparency, but sadly it looks like the color without transparency is still visible through transparent parts of the mesh.

This is the result with a black skybox:



White skybox:


Orange skybox:


Etc.

I believe this is because the transparent black color is still black, and the buffer is loaded with blackness even thought it is transparent. As a result, some postprocessing or transparency is blending with these values instead of correctly using the transparency. One idea I had is to take the pixels of the game under this UI and use it as a 'skybox', that way it would get blended with the correct colors of the game. (grabpass?)

If anyone has any better idea on what to do, it would be greatly appreciated.

 

not quite sure what you are trying to do or whether your screenshot is your desired looks to the render texture or the broken look? or whether the color band you are rendering has alpha in the source texture or not ?
I'm gonna take a guess/stab at what you are trying to do, and say its because the material/shader that you are using to render into the render texture either does or does not also write the texture's alpha into the render texture. (usually semi transparent textures rendered, use their alpha when calculating what color to draw into the target, but they don't write that alpha into the target. so the alpha channel is lost. If you want to keep that alpha, make sure the shader you are using has #pragma keepalpha or vice versa if you don't want the alpha written to your render texture.

or if you simply dont wan't the transparent color to show through.... render with a diffuse/opaque shader in the material. (that ignores alpha)

 

Thanks for taking your time to answer. I noticed parts of my UI were disappearing when drawing through the RenderTexture and those parts where black when I checked the alpha channel, so

#pragma keepalpha

might help with that issue.

However this is not the main issue I am pointing at with this thread. I've recorded a video which might show the problem a little better.

The color I am changing is the skybox solid color of a camera rendering only this UI to a RenderTexture. This RenderTexture is then finally rendered to the screen through UGUI with a RawImage. (anything could be used, UGUI is just to take advantage of the positioning capabilities)

The problem is that bloom seems to be blending the UI pixels with the skybox color instead of simply blending into real transparency. Notice how the skybox color can be seen being blended with the feathered edges of the rings. It's as if any transparent part of the RenderTexture is becoming tinted to the skybox color. Instead, I expect it to simply feather the edges of the ring into nothing, and have alpha blending take care of the rest when drawing the RenderTexture. When I set the alpha of the skybox to 100, that is essentially the correct result if this single solid color were the game itself.

I'm not sure if this is an issue with postprocessing or something fundamental about 3D graphics I don't understand. Even without postprocessing, this is also a problem with simple transparent meshes. For example, this texture has a transparent black texture fading into 100% transparency on the right.



However, the transparent parts are getting blended with the 100% transparent red clear color instead of remaining transparent black, giving it a pink-ish tint instead of transparent black.

UPDATE: After a lot of tweaking, I was able to get something much closer to the proper look.



If anyone else has this issue, try premultiplied alpha in your shader and review your values. IIRC I had the emission extremely high on my material, and lowering the emission while raising certain bloom parameters may have played a role as well. (or the other way around with bloom being too high) Even then, I can raise the emission quite a bit more currently and still get a decent look, so I think that premultiplied alpha is helping quite a bit.

It's not perfect yet and I still see colors changing when changing the transparent skybox color, but it's close enough to the point it can pass as a feature or appear intentional. With the right transparent color, it's near impossible to notice this artifact because it acts as a softener and adds a subtle feathering to the edges, as you can see in the above image.