How do I make the background transparent?

When I create my game, I can set the bottom most layer to transparent, and that appears to work quite well... but when I export it and try to open it up in Streamlabs OBS, the background colour changes from transparent to black.

Has anyone come across this before? Even though the CSS code within Streamlabs is set to:

body { background-color: rgba(0, 0, 0, 0) !important; margin: 0px auto; overflow: hidden; }

It still doesn't work. I seem completely unable to set it to transparent, yet I've seen other programs able to do it.

Is it something within C2 export, or like Streamlabs that's at fault?

What is suppost a transparent must be? 🤔

I'm trying to create an overlay using Construct 2.

So, I can make the background transparent, but that transparency doesn't remain when I open it in Streamlabs.

As it's an overlay, I'd like things to appear below the overlay, such as game footage.

I can use a solid colour, then colour key that our, but that doesn't work well with opacitys.

Pretty sure you have to set what the transparency will be in Obs.

cogentstudios.com/how-to-set-opacity-obs-studio

Not sure what you mean. I could understand if textbox objects are not working right as they are part of the dom, and not rendered at the same time. The same may apply to text objects as well.

Sorry, I'm not explaining myself very well.

It's for a Twitch overlay.

So in the background layer, Streamlabs displays the game.

On the layer above it is the HTML5 layer I'm working on. The overlay shows animations, text, etc. Objects move across quickly, and change opacity.

I have it working well enough if I set the background to 255 blue, and chroma/colour key that out, but then when things fade away or are partially opaque, I get this odd blue tint to them.

The example you posted suggested using an alpha image to remove things, which unfortunately didn't work with what I was trying to do.

I've seen people in Streamlabs say that they had issues with this before, but I can't tell if the problem is with C2 or Streamlabs, as I have another program that is working perfectly fine with transparency.

Ok, that's about all I can suggest, other that it could also be a hardware issue. Color values can be a bit off between different software drivers etc.

Not to worry newt

I'm not sure what's going on. I will key things out eventually if needbe, but wish transparency just worked.

If anyone else comes across this issue... the solution is to go into the index file and remove anything related to the background. So no background, and no colour :)

Then this code in streamlabs:

body { margin: 0px auto; overflow: hidden; }