Styling

Themes

NexusUI comes with 25+ beautiful pre-built themes. You can also create your own custom themes.

Using Themes

Set a theme when creating your window:

Set Theme

local Window = NexusUI:CreateWindow({
    Title = "My Script Hub",
    Theme = "Cyberpunk"  -- Theme name
})

Or change themes dynamically:

Change Theme

Window:SetTheme("Ocean")

Available Themes

Choose from any of these pre-built themes:

Dark

#0092D6

Light

#0092D6

Ocean

#00bcd4

Cyberpunk

#ff0055

Neon

#39ff14

Sunset

#ff6b35

Forest

#4caf50

Amethyst

#9c27b0

Crimson

#dc143c

Rose

#ff69b4

Aqua

#00ced1

Bloom

#da70d6

Serenity

#6495ed

Lavender

#b57edc

Ice

#87ceeb

Mocha

#d2691e

Slate

#708090

Copper

#b87333

Emerald

#50c878

Sapphire

#0f52ba

AmberGlow

#ffbf00

DarkBlue

#1e3a5f

Darker

#333333

Green

#00ff00

Custom Themes

Create your own custom theme by passing a theme table:

Custom Theme

local MyCustomTheme = {
    Name = "MyTheme",
    
    -- Main colors
    Accent = Color3.fromRGB(255, 100, 0),      -- Primary accent color
    AcrylicMain = Color3.fromRGB(20, 20, 25),  -- Main background
    AcrylicBorder = Color3.fromRGB(40, 40, 50), -- Border color
    AcrylicGradient = ColorSequence.new({
        ColorSequenceKeypoint.new(0, Color3.fromRGB(25, 25, 30)),
        ColorSequenceKeypoint.new(1, Color3.fromRGB(15, 15, 20))
    }),
    AcrylicNoise = 0.92,
    
    -- Title bar colors
    TitleBarLine = Color3.fromRGB(255, 100, 0),
    TitleColor = Color3.fromRGB(255, 255, 255),
    SubtitleColor = Color3.fromRGB(150, 150, 150),
    
    -- Tab colors
    TabBackground = Color3.fromRGB(25, 25, 30),
    TabStroke = Color3.fromRGB(40, 40, 50),
    TabBackgroundSelected = Color3.fromRGB(35, 35, 45),
    TabStrokeSelected = Color3.fromRGB(255, 100, 0),
    TabTextColor = Color3.fromRGB(180, 180, 180),
    SelectedTabTextColor = Color3.fromRGB(255, 255, 255),
    
    -- Element colors
    ElementBackground = Color3.fromRGB(30, 30, 35),
    ElementBackgroundHover = Color3.fromRGB(35, 35, 45),
    SecondaryElementBackground = Color3.fromRGB(25, 25, 30),
    ElementStroke = Color3.fromRGB(45, 45, 55),
    SecondaryElementStroke = Color3.fromRGB(40, 40, 50),
    
    -- Slider colors
    SliderBackground = Color3.fromRGB(0, 0, 0),
    SliderProgress = Color3.fromRGB(255, 100, 0),
    SliderStroke = Color3.fromRGB(45, 45, 55),
    
    -- Toggle colors
    ToggleBackground = Color3.fromRGB(30, 30, 35),
    ToggleEnabled = Color3.fromRGB(255, 100, 0),
    ToggleDisabled = Color3.fromRGB(60, 60, 70),
    ToggleEnabledStroke = Color3.fromRGB(255, 130, 50),
    ToggleDisabledStroke = Color3.fromRGB(80, 80, 90),
    ToggleEnabledOuterStroke = Color3.fromRGB(200, 80, 0),
    ToggleDisabledOuterStroke = Color3.fromRGB(50, 50, 60),
    
    -- Input colors
    InputBackground = Color3.fromRGB(25, 25, 30),
    InputStroke = Color3.fromRGB(45, 45, 55),
    PlaceholderColor = Color3.fromRGB(100, 100, 110),
    
    -- Text colors
    PrimaryTextColor = Color3.fromRGB(255, 255, 255),
    SecondaryTextColor = Color3.fromRGB(180, 180, 190),
    TertiaryTextColor = Color3.fromRGB(120, 120, 130),
    
    -- Dropdown colors
    DropdownBackground = Color3.fromRGB(25, 25, 30),
    DropdownSelected = Color3.fromRGB(255, 100, 0),
    
    -- Dialog colors
    DialogBackground = Color3.fromRGB(20, 20, 25),
    DialogButtonBackground = Color3.fromRGB(255, 100, 0),
    DialogButtonBackgroundHover = Color3.fromRGB(255, 130, 50),
    DialogButtonText = Color3.fromRGB(255, 255, 255),
    DialogInputBackground = Color3.fromRGB(30, 30, 35),
    DialogInputStroke = Color3.fromRGB(255, 100, 0),
    
    -- Notification colors
    NotificationBackground = Color3.fromRGB(25, 25, 30),
    NotificationActionsBackground = Color3.fromRGB(20, 20, 25),
}

-- Use the custom theme
local Window = NexusUI:CreateWindow({
    Title = "Custom Themed Hub",
    Theme = MyCustomTheme
})

Theme Tips

Tip: Keep your accent color consistent across all accent properties for a cohesive look.

Tip: Use subtle color variations (5-10 RGB difference) between background layers for depth.

Tip: Ensure sufficient contrast between text and background colors for readability.