Question / Help Transparent background using CLR Browser

joshisanonymous

joshisanonymous

New Member
I'm using TNotifier and running it through CLR Browser for notifications in OBS. I have a simply text notification for donations and I'd like the background for it to be transparent but I can't seem to make this happen.

I've heard that the default background color is automatically made transparent. Didn't work.
I've heard that the bright green color automatically gets chroma keyed out. Didn't work.
I've tried editing the CSS in both the widget and in the properties of the CLR Browser source to say the following:
background-color: transparent; Didn't work.
background-color: rgba(0, 0, 0, 0); Didn't work
opacity: 0; Didn't work.​

I've done many searches and watched videos and yet I can't find an answer to this problem, nor does anyone else seem to be having the same problem. I know transparency would be easier to accomplish with a window capture but I'd much rather use CLR Browser because it's simpler in literally every other way. Any help would be greatly appreciated.
 
Hey there, I'm having the exact same issue - you're not alone! I have the CLR Browser running the TNotifier Widget using the API, and anytime I get an alert - whether it's an announcement or a test alert I've triggered - it has a green background behind it.

Originally, when I configured my TNotifier Widget, I did change the background from #FFFFFF to #00FF00, because I didn't want a white background. I had configured OBS to use TNotifier via window capture, and had set the Chroma Key up to negate the green background. No such selection exists for the CLR Browser, and you're right - there are a number of posts regarding this, and none of them seem to have "the solution". (I even found a Reddit post from a year ago that went unanswered, after many many comments that weren't too helpful.)

I'm with you - let's hope you receive a response to this!

Rick
 
Gameroom Designs said:
JOSHISANONYMOUS - I have FIGURED IT OUT!

Go to your Widget Settings in TNotifier, and make the changes to your CUSTOM CSS, a la this page: https://tnotifier.net/faq/css/14

I made the changes, and restarted my OBS and it worked for me. Good luck!
Click to expand...


I tried that but it didn't work. did you use this exact css code: <div><br><div><pre><code class="language-css">.tm-widget .notification-box { background: transparent !important; }</code></pre></div></div>
 
You must log in or register to reply here.
Back
Top