All tools Developer helpers

UDim2 Converter

Convert between Scale and Offset for any screen size, with the code ready to paste.

On every screen

The same values on each device. Tap one to switch.

Position

X
Y

Size

X
Y

AnchorPoint

On: changing the anchor moves Position, so the frame stays where it is.

Parent

Paste a UDim2

Luau
FormPositionSize

Keep the shape

Scale sizes stretch on wide screens. A UIAspectRatioConstraint keeps your frame's shape: for this one.

The top bar

Roblox's top bar takes about 58 px at the top. With IgnoreGuiInset off, a ScreenGui starts below it. Turn IgnoreGuiInset on to use the whole screen.

Small screens

Offset stays the same size everywhere, so it looks huge on phones. Use Scale, or add a UIScale to shrink a whole menu on small screens.

How it works

  1. Pick a screen

    Phone, small phone, tablet, PC or console, with or without the Roblox top bar.

  2. Type or drag

    Enter Position and Size, or drag and resize the frame on the mock screen.

  3. Convert

    Turn Offset into Scale (or back) with one click. On this screen the frame stays exactly where it is.

  4. Check every device

    See the same values on all screens at once, then copy the code.

Questions

What's the difference between Scale and Offset?
Scale is a share of the parent (0.5 = half of it), so it grows with the screen. Offset is a fixed number of pixels, the same on every screen. UDim2.new(xScale, xOffset, yScale, yOffset) mixes both.
Should I use Scale or Offset?
Scale for most layout, so it fits phones and big monitors alike. Add a UIAspectRatioConstraint so frames keep their shape. Offset is fine for small things like padding or icons.
What does AnchorPoint do?
It picks which point of the frame sits on its Position. (0.5, 0.5) is the middle, so Position {0.5, 0},{0.5, 0} centers the frame on any screen.
Why is my UI under the top bar?
A ScreenGui starts below Roblox's top bar unless IgnoreGuiInset is on. Switch IgnoreGuiInset here to see both.
What is UDim2.fromScale?
A shorter way to write UDim2.new(x, 0, y, 0). UDim2.fromOffset(x, y) is UDim2.new(0, x, 0, y). This tool gives you all forms.