Full button size icons in TouchBar

I'm trying to make a TouchBar button that's constantly dynamically updated. My end goal is it will be a time series graph updated every minute or so.

I've tried a few things (all with the UI, as best I can tell there are no "hidden" options in the API), and I'm always getting a margin on the left and right sides. I have reduced the button corner radius to 0, the Extra padding and Free space after to 0 as well, and still getting padding on either side.

This is what it's looking like at the moment, using a 68x30px image (and BTT configured to match the same Icon width and height), from reading the forums there was mention that the touch bar was only 30px.
I have also tried a 136x60 (matching the size the screen shot from the Mac gives you), and still exactly the same thing.

I'm using a Widget as I have found in the past this is the best type to use to do regular updates (using a TouchBar Button didn't always update, but testing with this had the same results).

Is there a way I can make the icon take up the space of the entire button? Ideally BTT would still round the corners. I guess what I really want is a way to set the background to be an image rather than a colour.

I'm now trying the latest Alpha (v2.645), on a 2018 MacBook Pro, and it's still doing the same.


If you are trying to get rid of the extra grey borders left inside a button around a large icon, I found messing around with the "Extra padding inside" value did the trick. I had to set some of mine to a (-) negative value to get just the image as a button. If that's not what your problem was...I'm ok with leaving this here anyway.

That's it! Thanks!

It turned out I needed to make it -92 "Extra padding" for a 132px wide image (no idea how that works), but the end result is perfect! I can even turn on rounded corners again:


Now to make my actual graph rather than this ugly thing... :smile: