Hello. I am Sky, a user interface designer. A lot of people on Roblox want to be able to have triangular GUI objects and circular GUI objects on Roblox. Unfortunately, you cannot make triangular objects on Roblox, but what if I told you that you can make circular GUI objects on Roblox? Well, you actually can.
To do this, you’ll be needing a Roblox plugin called Roundify , made by @Stelrex . This plugin basically rounds the corners of your GUI. Though with this plugin, I just have figured out how to make circular GUI objects with this plugin.
Before you start these steps, have Roundify downloaded.
Step 1:
Open up Roblox Studio. Then, simply open up a place of yours. I just opened up a place I have.
Step 2:
Next, go to StarterGui and click on that plus sign right next to it, or you can right click on StarterGui and click on “Insert Object”. After that, insert a ScreenGui into StarterGui. It should be like this:
You can name the ScreenGui anything you want. I named it CircleGuiTest.
Step 3:
Insert another object into your ScreenGui. I’ll be inserting a frame. Once you’ve inserted a GUI object into your ScreenGui, look at your main screen.
I have a frame at the corner of my screen.
Step 4:
Now comes the part where you use roundify. Go to your plugins and you should see Roundify there. If you don’t go to Toolbox, and click on this:
Then, you should click on My Models and you will see this:
Click on “My Plugins”. Then, click on the plugin Roundify. It should be installed. If not, install it. Then, go to your plugins tab (not in toolbox), and click on Roundify. You’ll see this:
Click on the GUI object you are roundifying whether it is a frame or whatever GUI object you want. When you click Roundify, your GUI object should have rounded corners like this:
Step 5:
Now come the final part. You must make this into a circle. Go to your properties section and type in ScaleType. Remember to have your GUI object clicked on, so you can change the properties of your GUI object. Now, if you look at your ScaleType property, this is what you will see:
Change “Slice” to “Crop”.
Result:
A perfect circle.
This will work even if you put the ScaleType to anything else. As long as it is not “Slice”, your GUI object should turn into a circle.
Now if you do this with a TextButton for example, the result is a little more interesting. My ScaleType property for my TextButton is “Crop” and here is the result of it:
Anything but “Crop” or “Slice” will work for the TextButton. This applies to a TextLabel as well.
If you are having trouble with using the plugin Roundify, I suggest you check out @Stelrex’s post about the Roundify plugin. You can view that post here.
In Roblox you can make circular GUI objects with this plugin. Other external softwares such as Adobe XD allow you to make triangular and circular GUI objects. If you’d like to stick with Roblox when making GUIs, then here’s the tutorial on how to make circular GUI objects on Roblox.
Thanks for reading and have a great day!