How to make base 64 image brighter? It's really dim

Community Usage questions
1

I'm creating a template in Finale. I've been struggling with this icon/image thing for a while now so I just made a no icon/image rule (as if I was using Lemur) to make things easier. But I've put in a lot of work for this template (nearly 400 buttons) and I want to accomplish everything now so I don't have to keep coming back to the file every time I learn something new about OSC.

  1. How do I make a base 64 image brighter? Here's an image I designed for one of my time signature buttons, ready for the base 64 website:

Apparently I'm still a new user and can only put one embedded media item in a post.
I pretty much just typed in 4/4 in MS Word, made the page red, changed the font to Engraver Time.

Now here's what it looks like in the button:

Screen Shot 2022-08-23 at 3.27.32 AM
Screen Shot 2022-08-23 at 3.27.32 AM1450×726 60.9 KB

As you can see, it looks like Thanos did something to it. Here's what's in the CSS field:

Yeah, I'm really sorry. Here's the text though:
:host {
background:url([css code]) no-repeat;
background-size: 100% 100%;
}

Am I doing something wrong? Should I take a different approach, give it a normal 4/4 text and change the font from default to Engraver Time? (if possible)

  1. It's a little bigger than the rest of the buttons in the tab. Most likely something I didn't include in the CSS field. What did I miss?
2

Hi

For the thanos effect, the alpha fill off value can be, to me, the source of your issue. So put it to 1 to set the opacity to 1.
Hope.it helps

3

alpha fill off - 1 made it the 4/4 invisible. 0 did the trick. Now I just have retake the screenshot with a slightly darker shade of red.

But it still looks bigger than the two buttons beside it. Even though they're all set to the same size.