I was looking for a answer to this but could not find anything sorry if I didn’t look hard enough, I’m trying to render the text attached to a control that has a alpha of `0.3`

but I can’t seem to figure out how to remove the alpha values for child controls: https://www.babylonjs-playground.com/#XCPP9Y#1317

Hi @i73

You can get a corrected alpha by dividing by parent’s alpha (does not work if parent is 0)

https://www.babylonjs-playground.com/#XCPP9Y#1318

Or you can separate the rectangle from the textblock, and put them in a shared container

https://www.babylonjs-playground.com/#XCPP9Y#1319

Thank you so much Weirdo, though I have one question why does dividing by the parents alpha work? I would have never come to that solution on my own.

Hi @i73

The alpha value is inherited,

So if the parent have 0.5 alpha, and child have 1.0,

the child effectively have 1 (100%) of 0.5 = 0.5.

By dividing, we can get a corrected alpha,

we want the value/effect of 1 alpha, parent have 0.5, so with the above in mind,

to get the effect of 1 alpha, it actually has to be 2, (2x parent alpha)

1 / 0.5 = 2

So now the math looks like this:

2 (200%) of 0.5 = 1