How to Make Settings in Roblox Studio (Copy & Paste)







How to Make Settings in Roblox Studio (Copy & Paste)















Roblox Studio • UI & UX

How to Make Settings in Roblox Studio (Copy & Paste)

How to make settings in Roblox Studio with a gear button and three toggles
Right-side gear button opens a client-only settings panel: brightness, saturation, and low graphics.

Follow this quick guide on how to make settings in Roblox Studio. Drop a single LocalScript in
StarterPlayer ▸ StarterPlayerScripts to get a right-side gear button and a clean panel with three client-only toggles:
high brightness, high saturation, and a low graphics mode. Copy the exact code below.

On this page

Create and place the LocalScript

In Explorer, go to StarterPlayer ▸ StarterPlayerScripts, insert a LocalScript, and name it
SettingsUI. Then paste the code from the next section. Everything runs client-only and doesn’t affect the server.

Useful references:
Client & Server model ·
LocalScript

SettingsUI — exact code (copy & paste)

Click “Copy code” to grab the script exactly as-is (gear icon included).

lua — StarterPlayer ▸ StarterPlayerScripts ▸ SettingsUI (LocalScript)
--[[
=====================================================================
SettingsUI (LocalScript) — drop into StarterPlayerScripts
---------------------------------------------------------------------
Features
- Right-side square "gear" button (rounded, bordered) to open the panel
- Settings panel with three toggles:
    1) High Brightness
    2) High Saturation
    3) Low Graphics Mode (disable fancy visuals client-side)
- All effects are per-player (client only)
- Script is split into clear sections with explanations
=====================================================================
]]

-- ========== [ Services ] ==========
local Players      = game:GetService("Players")
local TweenService = game:GetService("TweenService")
local UserInput    = game:GetService("UserInputService")
local Lighting     = game:GetService("Lighting")
local Workspace    = game:GetService("Workspace")

local player    = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

-- ================================================================
-- [ SECTION 1 ]  Color Correction Utilities
-- ================================================================
local function ensureColorCorrection()
    local cc = Lighting:FindFirstChild("SettingsUI_ColorCorrection")
    if not cc then
        cc = Instance.new("ColorCorrectionEffect")
        cc.Name = "SettingsUI_ColorCorrection"
        cc.Parent = Lighting
        cc.Brightness = 0
        cc.Saturation = 0
        cc.Contrast   = 0
    end
    return cc
end
local CC = ensureColorCorrection()

-- ================================================================
-- [ SECTION 2 ]  LOW GRAPHICS MODE
-- ================================================================
local lowGfx = {
    surfaceParents = {}, -- [SurfaceAppearance] = original Parent
    decals        = {},  -- [Decal/Texture] = original Transparency
    partsEnabled  = {},  -- [ParticleEmitter/Trail/Beam] = original Enabled
    postEnabled   = {},  -- [Bloom/DOF/SunRays] = original Enabled
    atmo          = nil, -- {ref = Atmosphere, Density = x, Haze = y}
    _cached       = false,
    active        = false,
}

local function enumerateWorldOnce()
    if lowGfx._cached then return end

    for _, inst in ipairs(Workspace:GetDescendants()) do
        if inst:IsA("SurfaceAppearance") then
            lowGfx.surfaceParents[inst] = inst.Parent
        elseif inst:IsA("Decal") or inst:IsA("Texture") then
            lowGfx.decals[inst] = inst.Transparency
        elseif inst:IsA("ParticleEmitter") or inst:IsA("Trail") or inst:IsA("Beam") then
            lowGfx.partsEnabled[inst] = inst.Enabled
        end
    end

    for _, eff in ipairs(Lighting:GetChildren()) do
        if eff:IsA("BloomEffect") or eff:IsA("DepthOfFieldEffect") or eff:IsA("SunRaysEffect") then
            lowGfx.postEnabled[eff] = eff.Enabled
        end
    end

    local atmo = Lighting:FindFirstChildOfClass("Atmosphere")
    if atmo then
        lowGfx.atmo = { ref = atmo, Density = atmo.Density, Haze = atmo.Haze }
    end

    lowGfx._cached = true
end

local function setLowGraphics(on)
    enumerateWorldOnce()

    if on then
        for sa in pairs(lowGfx.surfaceParents) do
            if sa and sa.Parent ~= nil then sa.Parent = nil end
        end
        for d in pairs(lowGfx.decals) do
            if d and d.Parent then d.Transparency = 1 end
        end
        for p in pairs(lowGfx.partsEnabled) do
            if p and p.Parent then p.Enabled = false end
        end
        for eff in pairs(lowGfx.postEnabled) do
            if eff and eff.Parent then eff.Enabled = false end
        end
        if lowGfx.atmo and lowGfx.atmo.ref then
            local a = lowGfx.atmo.ref
            a.Density = 0
            a.Haze    = 0
        end
    else
        for sa, parent in pairs(lowGfx.surfaceParents) do
            if sa and parent and parent.Parent ~= nil then
                sa.Parent = parent
            end
        end
        for d, was in pairs(lowGfx.decals) do
            if d and d.Parent then d.Transparency = was end
        end
        for p, was in pairs(lowGfx.partsEnabled) do
            if p and p.Parent then p.Enabled = was end
        end
        for eff, was in pairs(lowGfx.postEnabled) do
            if eff and eff.Parent then eff.Enabled = was end
        end
        if lowGfx.atmo and lowGfx.atmo.ref then
            local a = lowGfx.atmo.ref
            a.Density = lowGfx.atmo.Density
            a.Haze    = lowGfx.atmo.Haze
        end
    end

    lowGfx.active = on
end

-- ================================================================
-- [ SECTION 3 ]  UI: Right-side Gear Button + Settings Panel
-- ================================================================
local gui = Instance.new("ScreenGui")
gui.Name = "SettingsUI"
gui.IgnoreGuiInset = true
gui.ResetOnSpawn = false
gui.DisplayOrder = 500
gui.Parent = playerGui

-- Right-side gear button (square, rounded, bordered)
local GEAR_SIZE = 72
local gearBtn = Instance.new("TextButton")
gearBtn.Name = "GearButton"
gearBtn.Size = UDim2.new(0, GEAR_SIZE, 0, GEAR_SIZE)
gearBtn.Position = UDim2.new(1, -(GEAR_SIZE + 12), 0.5, -(GEAR_SIZE // 2))
gearBtn.Text = "⚙"
gearBtn.TextScaled = true
gearBtn.Font = Enum.Font.GothamBold
gearBtn.TextColor3 = Color3.fromRGB(230, 235, 240)
gearBtn.BackgroundColor3 = Color3.fromRGB(32, 36, 42)
gearBtn.AutoButtonColor = true
gearBtn.Parent = gui
do
    local c = Instance.new("UICorner"); c.CornerRadius = UDim.new(0, 14); c.Parent = gearBtn
    local s = Instance.new("UIStroke"); s.Thickness = 2; s.Color = Color3.fromRGB(22, 24, 28); s.ApplyStrokeMode = Enum.ApplyStrokeMode.Border; s.Parent = gearBtn
end

-- Settings Panel (slides in from right near the gear)
local panel = Instance.new("Frame")
panel.Name = "Panel"
panel.Size = UDim2.new(0, 320, 0, 220)
panel.Position = UDim2.new(1, 24, 0.5, -110) -- start off-screen to the right
panel.BackgroundColor3 = Color3.fromRGB(22, 24, 28)
panel.BackgroundTransparency = 0.05
panel.Parent = gui
do
    local c = Instance.new("UICorner"); c.CornerRadius = UDim.new(0, 14); c.Parent = panel
    local s = Instance.new("UIStroke"); s.Thickness = 2; s.Color = Color3.fromRGB(18, 20, 23); s.Parent = panel
end

local header = Instance.new("TextLabel")
header.BackgroundTransparency = 1
header.Size = UDim2.new(1, -44, 0, 40)
header.Position = UDim2.new(0, 14, 0, 8)
header.Text = "Settings"
header.TextScaled = true
header.Font = Enum.Font.GothamBold
header.TextXAlignment = Enum.TextXAlignment.Left
header.TextColor3 = Color3.new(1,1,1)
header.Parent = panel

local closeX = Instance.new("TextButton")
closeX.Size = UDim2.new(0, 36, 0, 36)
closeX.Position = UDim2.new(1, -44, 0, 8)
closeX.Text = "X"
closeX.TextScaled = true
closeX.Font = Enum.Font.GothamBold
closeX.TextColor3 = Color3.new(1,1,1)
closeX.BackgroundColor3 = Color3.fromRGB(140, 50, 50)
closeX.Parent = panel
do local c = Instance.new("UICorner"); c.CornerRadius = UDim.new(0, 10); c.Parent = closeX end

-- ================================================================
-- [ SECTION 4 ]  Toggle Factory
-- ================================================================
local function makeToggle(labelText, yOffset, color, initial, onChange)
    local btn = Instance.new("TextButton")
    btn.Name = labelText
    btn.Size = UDim2.new(1, -28, 0, 44)
    btn.Position = UDim2.new(0, 14, 0, yOffset)
    btn.BackgroundColor3 = color
    btn.TextColor3 = Color3.new(1,1,1)
    btn.Font = Enum.Font.GothamBold
    btn.TextScaled = true
    btn.AutoButtonColor = true
    btn.Parent = panel
    do local c = Instance.new("UICorner"); c.CornerRadius = UDim.new(0, 10); c.Parent = btn end

    local state = initial
    local function refresh()
        btn.Text = (state and "ON  " or "OFF ") .. "— " .. labelText
        btn.BackgroundTransparency = state and 0 or 0.35
    end
    refresh()

    btn.MouseButton1Click:Connect(function()
        state = not state
        refresh()
        onChange(state)
    end)

    return {
        set = function(v) state = v; refresh(); onChange(state) end,
        get = function() return state end,
    }
end

-- ================================================================
-- [ SECTION 5 ]  Create the Three Toggles
-- ================================================================
local brightToggle = makeToggle("High Brightness", 58, Color3.fromRGB(70, 130, 240), false, function(on)
    CC.Brightness = on and 0.25 or 0
end)

local saturToggle = makeToggle("High Saturation", 110, Color3.fromRGB(240, 160, 70), false, function(on)
    CC.Saturation = on and 0.35 or 0
end)

local lowGfxToggle = makeToggle("Low Graphics Mode", 162, Color3.fromRGB(90, 170, 90), false, function(on)
    setLowGraphics(on)
end)

-- ================================================================
-- [ SECTION 6 ]  Open/Close Animations and Input
-- ================================================================
local function openPanel()
    TweenService:Create(panel, TweenInfo.new(0.22, Enum.EasingStyle.Quad, Enum.EasingDirection.Out),
        { Position = UDim2.new(1, -340, 0.5, -110) }):Play()
end
local function closePanel()
    TweenService:Create(panel, TweenInfo.new(0.22, Enum.EasingStyle.Quad, Enum.EasingDirection.In),
        { Position = UDim2.new(1, 24, 0.5, -110) }):Play()
end

gearBtn.MouseButton1Click:Connect(openPanel)
closeX.MouseButton1Click:Connect(closePanel)

-- Optional dev shortcut: F7 toggles the panel
UserInput.InputBegan:Connect(function(input, gpe)
    if gpe then return end
    if input.KeyCode == Enum.KeyCode.F7 then
        if panel.Position.X.Offset > 0 then openPanel() else closePanel() end
    end
end)

Why this approach works

Everything is client-only, perfect when you’re learning how to make settings in Roblox Studio.
Visual effects use a single ColorCorrectionEffect; performance comes from temporarily disabling costly visuals and restoring them cleanly.

More reading:
ColorCorrectionEffect ·
Atmosphere ·
Roblox publishing checklist (example)