Frame panels

Why use Frame?

Frame is a basic UI container. It provides size, position, background and a parent for related controls, which makes a menu easier to arrange and update.

Try it in Roblox Studio

Add a ScreenGui named PracticeGui to StarterGui and place this LocalScript inside it. Run a client in Studio.

Syntax

frame.Size = UDim2.fromScale(0.4, 0.3)

Examples

Create a centered dark panel.

local screenGui = script.Parent
assert(screenGui:IsA("ScreenGui"))
local frame = Instance.new("Frame")
frame.Name = "MenuPanel"
frame.Size = UDim2.fromScale(0.4, 0.3)
frame.AnchorPoint = Vector2.new(0.5, 0.5)
frame.Position = UDim2.fromScale(0.5, 0.5)
frame.BackgroundColor3 = Color3.fromRGB(28, 34, 48)
frame.Parent = screenGui

Size uses a fraction of the parent screen, so the panel scales with the viewport.
AnchorPoint moves the alignment point to the Frame center; Position puts that point at screen center.
BackgroundColor3 is a GuiObject property inherited by Frame. Child controls can be parented to this panel.

Best practices

Use scale where responsive sizing matters, then set sensible constraints if needed.
Keep text contrast high against panel backgrounds.

Runtime & versions

Luau host; Roblox engine examples require Roblox Studio. Feature availability depends on the language and runtime version used by your project; consult the official reference below.

Luau documentation