We use cookies on this site to enhance your user experience
Collapse Sidebar




ZIndex determines the order in which UI elements are rendered to the screen in ascending priority order. Lower values are rendered first, so lower values appear under higher values. The ScreenGui.ZIndexBehavior property also helps determine the rendering order of UI elements.

The range of valid ZIndex values is 1 to 999,999,999, inclusive. If you are unsure if you will need to layer an element between two already-existing elements in the future, it can be a good idea to use multiples of 100, i.e. 0, 100, 200. This ensures a large gap of ZIndex values you can use for elements rendered in-between other elements…

Code Samples

ZIndex Alternate

This code sample flips the ZIndex rendering order of two frames.

-- Place this in a LocalScript that is a sibling of
-- two GuiObjects called "FrameA" and "FrameB"
local gui = script.Parent
local frameA = gui:WaitForChild("FrameA")
local frameB = gui:WaitForChild("FrameB")

while true do
	-- A < B, so A a renders first (on bottom) 
	frameA.ZIndex = 1
	frameB.ZIndex = 2
	-- A > B, so A renders second (on top)
	frameA.ZIndex = 2
	frameB.ZIndex = 1