Optical UI Library

⚙️ Installation

local UI = loadstring(game:HttpGet("https://raw.githubusercontent.com/ZaHando15/Optical-UI-Lib-Documentation/refs/heads/main/Base"))()

✏️ Change Window Title

Update the top-bar text and the ScreenGui name in one call:

UI:SetTitle("Your Script")

🚀 Quick Start

local Main = UI:MakeCat({Name = "Main"})

📦 Control Reference

Label – AddLabel(text)
Button – AddButton(opts)
Checkbox Toggle – AddToggle(opts)
Keybind – AddKeybind(opts) WIP
Slider – AddSlider(opts)
Dropdown – AddDropdown(opts)
Color Picker – AddColorPicker(opts) WIP

1. Label

Cat:AddLabel("Information text")

2. Button

Cat:AddButton({
    Name = "Kill All",
    Callback = function()
    end
})

3. Checkbox Toggle (left-side decal)

Cat:AddToggle({
    Name = "ESP",
    Default = false,
    Callback = function(state)
    end
})

4. Keybind (left-side decal) WIP

Cat:AddKeybind({
    Name = "Toggle Fly",
    Callback = function()
    end
})

5. Slider

Cat:AddSlider({
    Name = "WalkSpeed",
    Default = 16,
    Max = 200,
    Callback = function(value)
    end
})

6. Dropdown (multi-select)

Cat:AddDropdown({
    Name = "Teleports",
    Options = {"Spawn", "Base", "Shop"},
    Default = {"Spawn"},
    Callback = function(selected)
    end
})

7. Color Picker (HSV square + hue bar) WIP

Cat:AddColorPicker({
    Name = "ESP Colour",
    Default = Color3.fromRGB(255,0,0),
    Callback = function(color)
    end
})

🪟 Window Controls

Drag – grab top bar
Minimize – - button
Close – X button (smooth destroy)

🧪 Global Keybind Table

All binds are stored in UI.Keybinds (array) for listing / clearing:

for _,k in pairs(UI.Keybinds) do
    print(k.Name, k.Key.Name)
end

📄 Full Example Tab

local Visuals = UI:MakeCat({Name = "Visuals"})

Visuals:AddToggle({Name = "ESP", Default = false, Callback = function(v)
end})

Visuals:AddKeybind({Name = "Toggle Fly", Callback = function()
end})

Visuals:AddColorPicker({Name = "ESP Colour", Default = Color3.new(1,0,0), Callback = function(c)
end})

Visuals:AddSlider({Name = "Transparency", Default = 0, Max = 100, Callback = function(v)
end})

🎨 Built-in Assets

Empty square: rbxassetid://6031068420
White check: rbxassetid://6031068421
Hue strip: rbxassetid://6998583936
Saturation mask: rbxassetid://6998583760