Away 10:16 PM

6 min read

Source: Roblox Creator Hub · CC BY 4.0 · View source · Code samples: MIT Imported 2026-10-03. Formatting adapted for this site.

Size modifiers and constraints

Alongside basic sizing of UI objects, you can utilize size modifiers to scale an object proportionally or automatically resize it. You can also insert size constraints to control aspect ratio, or set a minimum and maximum size or text size.

Scale

A UIScale object stores a numerical value that multiplies the AbsoluteSize property of the parent GuiObject. For example, if you want an object to be twice as large as it currently is, you can insert a UIScale object with a Scale property of 2.

This modifier is useful for "zooming in" while designing a detailed user interface in Studio, since it proportionally scales the object and all of its children, including any applied appearance modifiers like UIStroke or UICorner. It's also useful to tween the size of an object, for example to slightly increase the size of a button when a player hovers their mouse over it.

Automatic sizing

The AutomaticSize property automatically resizes a parent GuiObject to the size of its descendants. You can use this property in a variety of cases, including:

You can enable the AutomaticSize property for any GuiObject. By default, it is set to None, but you can change its value to have specific control over which direction(s) the GuiObject resizes to fit its content.

Note

ScrollingFrame uses the AutomaticCanvasSize property instead of AutomaticSize. It behaves the same but resizes the frame's CanvasSize, not its base Size.

To enable automatic sizing:

  1. In the Explorer window, click any GuiObject, such as a Frame, TextBox, or ImageLabel.

  2. In the Properties window, navigate to the AutomaticSize property (AutomaticCanvasSize for ScrollingFrame) and set it to one of the following options:

    • X — Resizes content horizontally.
    • Y — Resizes content vertically.
    • XY — Resizes content both horizontally and vertically.

Once automatic sizing is set, note that other object properties behave as follows:

AnchorPoint

Similar to the concept of sizing an object, AutomaticSize takes the AnchorPoint property into consideration when resizing content. For example, the following video displays three TextLabels that automatically resize from their anchor point.

Size

When you enable AutomaticSize, the object's Size property controls its minimum size. This means that the GuiObject cannot resize smaller than its core size along any axis.

For example, the following white Frame has a Size of 0 for both axes, meaning it doesn't have a minimum width/height and can resize according to its child objects.

In comparison, the following white Frame has a Size.X of 100, so it cannot resize to a width less than 100 pixels.

TextWrapped

When you enable text wrapping for a UI text object (TextLabel, TextButton, or TextBox) and set the AutomaticSize property to either Y or XY, the label resizes to accommodate any text that wraps across multiple lines. For example, the following TextLabel has TextWrapped enabled and an AutomaticSize of Y, so when text overflows the width and wraps, the label expands vertically.

Constraints

There are three types of constraints you can use for a user interface object: size, text size, and aspect ratio. To use a constraint, you must set it as a child of the GuiObject you want to constrain.

Size

The UISizeConstraint specifies a minimum and maximum size for a GuiObject. This constraint ensures that the GuiObject doesn't become too small or large on different screen sizes.

For example, if you set the MinSize property to (200, 200) and the MaxSize property to (400, 400) , the GuiObject cannot scale smaller than 200×200 pixels or larger than 400×400 pixels.

Note

When a UI object is under control of both a layout structure such as UIListLayout and a UISizeConstraint, the constraint will override the layout and control the object's size.

Text size

The UITextSizeConstraint specifies a minimum and maximum font size for a GuiObject with text, such as a TextLabel, TextButton, or TextBox. This constraint ensures that the text within a GuiObject doesn't become illegible or too large.

If you enable the TextScaled property of the parent GuiObject, the text size scales with the container's size and respects constraints even if the object becomes smaller or larger than the MinTextSize and MaxTextSize values.

For example, the following TextLabel object has a UITextSizeConstraint with a MinTextSize value of 50 and a MaxTextSize value of 80. Even when the TextLabel becomes smaller, the font never becomes smaller than 50 pixels, and when the object becomes large, the font next exceeds 80 pixels.

Note

Do not use MinTextSize property values lower than 9 or the text will be difficult to read for many viewers.

Aspect ratio

The UIAspectRatioConstraint enforces a width‑to‑height aspect ratio on a GuiObject regardless of its core size, even if that size is set as a percentage of its parent. For example, inserting this constraint as a child of a Frame and setting the constraint's AspectRatio property to 2 (2:1) keeps the frame's width at twice that of its height. Similarly, setting this constraint's AspectRatio property to 0.5 (0.5:1) keeps the frame's width at half that of its height.

Setting this constraint's AspectRatio to the default of 1 (1:1) is a convenient way to prevent non‑proportional scaling/stretching of an ImageLabel with a square image asset, such as an avatar thumbnail.

Note

When a UI object is under control of both a layout structure such as UIListLayout and a UIAspectRatioConstraint, the constraint will override the layout and control the object's size.