Manipulate ui canvas button hitbox

This should be simple but can’t find it anywhere.
I made a UI button and made the source image my own image. I set it to native size and it looks good but…


there seems to be some buffer in between my image and the border that I can’t get rid of. I would want the border to hug the edges, or else the user can press the button without touching it. Any ideas?

Working with the UI can be fun AND frustrating :slight_smile: It will take practice.

But anyway, here is a way to achieve this:

  • In the RectTransform, choose the Anchor Preset for Stretch X&Y (it’s the icon in the lower right corner when you open the Anchor Preset flyout (also the Anchor Preset is the button that has “stretch” and “stretch” next to it
  • Then (and this is important) - edit LEFT, TOP, RIGHT and BOTTOM values, make them all 0 (this will fill out the image to the full size)


Make sure your button image is not like this.

In the canvas it will look like this.


So make sure your button image size is cropped till the border of the image. There should not be any transparency.