1

How can I make a button with rounded corners.

3

I made a Unity Package for doing such things very fast and directly in Unity. And you’re also able to animate the border-radius and border-width.

AssetStore link: Procedural UI Image | GUI Tools | Unity Asset Store

2

Create an image with rounded corners (and blank in the center).
Import as sprite, slicing it up so the corners do not get stretched (drag the green lines). http://i.imgur.com/6qwCT9j.png

Set it as image for the Button http://i.imgur.com/gB5VtRY.png

5

By far the easiest way I’ve ever found is to just make the button in PowerPoint (rounded corners or whatever design you want), then right click, save as image, drag and drop into unity. Lastly, in the inspector change the Texture Type to sprite (2D and UI) and assign it as the Source Image for your button. Beautifully rounded buttons in just 5 minutes:)

6

In case you want procedurally generated mesh:

public class RoundedButton : MonoBehaviour {
    [SerializeField] private float width;
    [SerializeField] private float height;
    [SerializeField] private float borderRadius;

    [SerializeField] private MeshFilter meshFilter;

    [Button]
    private void GenerateMesh() {
        var w = width * .5f;
        var h = height * .5f;


        var vertices = new Vector3[91 * 4];
        var j = 0;
        for (var startAngle = 0; startAngle < 360; startAngle += 90) {
            var p = new Vector3((w - borderRadius) * (startAngle == 0 || startAngle == 270 ? 1 : -1),
                (h - borderRadius) * (startAngle < 180 ? 1 : -1));
            for (var i = startAngle; i <= startAngle + 90; i++) {
                var a = i * Mathf.Deg2Rad;
                vertices[j++] = p + new Vector3(Mathf.Cos(a), Mathf.Sin(a)) * borderRadius;
            }
        }
        
        var triangles = new int[90 * 3 * 4 + 18];

        for (var o = 0; o < 4; o++) {
            var offset = o * 90;
            var aoff = o * 91;
            triangles[offset * 3] = aoff;
            triangles[1 + offset * 3] = 90 + aoff;
            triangles[2 + offset * 3] = 89 + aoff;


            for (var i = 3; i < 90 * 3; i += 3) {
                triangles[i + offset * 3] = aoff;
                triangles[i + 1 + offset * 3] = triangles[i - 1 + offset * 3];
                triangles[i + 2 + offset * 3] = triangles[i - 1 + offset * 3] - 1;
            }
        }

        var remaining = new[] {
            0, 91, 90,
            91, 182, 181,
            182, 273, 272,
            273, 0, 363,
            273, 91, 0,
            273, 182, 91
        };

        for (var i = 0; i < 18; i++) triangles[90 * 3 * 4 + i] = remaining*;*

meshFilter.mesh = new Mesh {vertices = vertices, triangles = triangles};
}

private void OnValidate() {
if (meshFilter == null)
meshFilter = GetComponent();

GenerateMesh();
}
}

4

You are a golden god. These are the kinds of UI tools that should have come with Unity out of the box.

7

Unity introduced the UI Toolkit you can use to edit a button’s border radius and other UI elements.

It offers a lot of flexibility but has a bit of a learning curve. If you’re comfortable working with CSS or have built websites using a no-code solution like Webflow, it shouldn’t be as much of a climb.