Get rid of blurry edges of the progress bar

Hi so whenever I try to make a UI progress bar there is blurred lines around the edges that look really ugly and only the right side of the black border around it is showing, does anyone know how to fix this, thank you!

Using a very basic material like this would give you quite a bit of flexibility:

As a bonus, you get to decide how rounded the corners are. And since we’re using a material, it really opens up the options. You can skip the colour in the material and use tint on the Progress Bar instead.

And to take it further, you’d eventually want to use separate instances of this material for Fill & Background respectively.


Thank you so much for your help, I’m going to implement this right now! :slight_smile:

Do you know how I can apply the material to the widget progress bar?

It’s here:

1 Like

Okay thank you, one last question, how do I get rid of the black border around the progress bar, thank you so much!

You may need to clarify this one, could you show the border?

1 Like

Oh never mind, I figured it out, I hadn’t set the background image yet, thank you anyways :slight_smile:

1 Like