How to position and size GUI elements to fit all screen sizes?

,

I know this has been asked quite a lot before, but I haven’t found an answer that tackles all scenarios.

For example, how would I keep an image’s size consistent across all screen sizes, an 80x80 sized image would look a lot smaller on a 4k screen than on a 1920x1080 screen, and if I use scale it would stretch.

So how should I go about making my GUI to look the same across all screen sized?
And at which ratio and screen size should I make my GUIs at?

1 Like

Just copy the position and paste it into size.
This should work else use autoscale lite.

1 Like

That’s not how GUIs work… Please delete your reply if you are trolling.

Use Scale, but do not be afraid to use Offset!

For example, if I wanted to make a frame that covered the whole screen but had a little bit of padding, I’d probably do something like this:

image

You can’t do this with just Scale alone. You can’t use one without the other. Insert quote about teamwork here.

Then just solve your problem yourself. First of all try my idea. It worked for me.

How do you even get to the idea that he is trolling, he’s kind enough to help you out with a question which is basically screaming “not very smart btw” and you’re seriously saying this. Man this is becoming a comedy page.

Hello friend!

To make the UI consistent in regard to size and position on all devices you must be using Scale rather than Offset. This is already shown in the above replies.

A good plugin for this would be AutoScale Lite - Roblox as this does not require you to mess around and muddle with the Scale values but instead allows you to resize and position the UI using your mouse/cursor.

Hope this is of help!

2 Likes