Roblox GUI Generator

Client-Side Secure

Visual tree builder for Roblox UIs. Instantly generates the Instance.new() boilerplate code for your scripts.

Back To Tools

Explorer

Drag via the handle or use Alt +Arrow keys to reorder and nest.

ScreenGui

Properties

Name

ResetOnSpawn

ZIndex

Live Preview

Lua Source

-- Generated by RootUtils GUI Builder
local Players = game:GetService("Players")
local PlayerGui = Players.LocalPlayer:WaitForChild("PlayerGui")

local screenGui = Instance.new("ScreenGui")
screenGui.Parent = PlayerGui

Is this tool broken?

Let us know if you found a bug or have a feature request.

The Ultimate Roblox GUI Generator

Stop writing thousands of lines of Instance.new("Frame") by hand. The RootUtils Roblox GUI Builder is an advanced visual editor that lets you design professional User Interfaces (UI) in your browser and instantly exports clean, production-ready Lua scripts.

Whether you are building a Main Menu, an Inventory System, or a HUD, this tool mimics the Roblox Studio Explorer workflow to make scripting 10x faster.

Live Real-Time Preview

Never guess your UDim2 values again. Our live rendering engine translates Roblox properties into CSS instantly, letting you see exactly how your UI looks on Desktop (1920x1080) vs Mobile screens before you export.

Clean Lua Code Export

We generate optimized code using the standard Instance.new method. The generator automatically handles property nesting, UDim2 scaling, Color3 conversion, and smart variable naming based on your hierarchy.

Visual Tree Editor

Organize your ScreenGui, Frames, and Buttons in a nested tree structure. Drag-and-drop with handles, keyboard movement, and full property control for ZIndex, Transparency, and LayoutOrder.

Save & Load Projects

Working on a complex shop interface? Don't lose your progress. Export your entire GUI tree to a JSON file and import it back anytime to continue editing or share it with your team.

Frequently Asked Questions

Is the generated code compatible with Roblox Studio?

Yes! The output is standard Lua 5.1 code compatible with all versions of Roblox Studio. Simply copy and paste it into a LocalScript.

Does this support ScrollingFrames?

Yes, we fully support complex instances like ScrollingFrame, ImageLabel, and TextButton, including properties like CanvasSize.

How do I use Custom Fonts?

Currently, we support the default font set. For custom fonts, you can easily find the Font property line in the generated code and change it to Enum.Font.Gotham or your desired ID.

Roblox Color3 & BrickColor

Convert Hex/RGB to Roblox Color3.new(), Color3.fromRGB(), and find the closest BrickColor.

Robux Tax & DevEx Calc

Calculate the 30% Roblox marketplace fee and convert Robux to real-world USD (DevEx).

Keyboard Test

Free online Keyboard Test. Check for ghosting, key rollover, and broken keys on your mechanical or laptop keyboard. Instant visual feedback.