Customizable button toggle script

Resources Community Resources
#1

I made this script casually, you can use it if you like

local TweenService = game:GetService("TweenService")

-- Customizable
local frameSize = UDim2.new(0, 42, 0, 22)
local frameColor = Color3.fromRGB(32, 32, 32)
local shadowColor = Color3.fromRGB(20, 20, 20)
local shadowTransparencyDefault = 0.8
local shadowTransparencyActive = 0.9
local glowColorDefault = Color3.fromRGB(150, 90, 255)
local glowColorActive = Color3.fromRGB(170, 120, 255)
local glowTransparencyDefault = 0.85
local glowTransparencyActive = 0.75
local circleSizeDefault = UDim2.new(0, 18, 0, 18)
local circleSizeActive = UDim2.new(0, 18.5, 0, 18.5)
local circleStartPos = UDim2.new(0, 2, 0.5, 0)
local circleEndPos = UDim2.new(1, -20, 0.5, 0)
local innerGlowTransparencyDefault = 0.85
local innerGlowTransparencyActive = 0.7
local tweenTime = 0.4
local breatheTime = 2.5
local rotateSpeed = 0.1

local button = script.Parent
local frame = Instance.new("Frame")
frame.Size = frameSize
frame.Position = UDim2.new(0.5, 0, 0.5, 0)
frame.AnchorPoint = Vector2.new(0.5, 0.5)
frame.BackgroundColor3 = frameColor
frame.Parent = button

local softShadow = Instance.new("Frame")
softShadow.Size = UDim2.new(1, 8, 1, 8)
softShadow.Position = UDim2.new(0.5, 0, 0.5, 0)
softShadow.AnchorPoint = Vector2.new(0.5, 0.5)
softShadow.BackgroundColor3 = shadowColor
softShadow.BackgroundTransparency = shadowTransparencyDefault
softShadow.ZIndex = 0
softShadow.Parent = frame

local softShadowCorner = Instance.new("UICorner")
softShadowCorner.CornerRadius = UDim.new(1, 0)
softShadowCorner.Parent = softShadow

local mainCorner = Instance.new("UICorner")
mainCorner.CornerRadius = UDim.new(1, 0)
mainCorner.Parent = frame

local ambientGlow = Instance.new("Frame")
ambientGlow.Size = UDim2.new(1, 6, 1, 6)
ambientGlow.Position = UDim2.new(0.5, 0, 0.5, 0)
ambientGlow.AnchorPoint = Vector2.new(0.5, 0.5)
ambientGlow.BackgroundColor3 = glowColorDefault
ambientGlow.BackgroundTransparency = glowTransparencyDefault
ambientGlow.Parent = frame

local ambientCorner = Instance.new("UICorner")
ambientCorner.CornerRadius = UDim.new(1, 0)
ambientCorner.Parent = ambientGlow

local circle = Instance.new("Frame")
circle.Size = circleSizeDefault
circle.Position = circleStartPos
circle.AnchorPoint = Vector2.new(0, 0.5)
circle.BackgroundColor3 = Color3.fromRGB(255, 255, 255)
circle.Parent = frame

local circleCorner = Instance.new("UICorner")
circleCorner.CornerRadius = UDim.new(1, 0)
circleCorner.Parent = circle

local circleGradient = Instance.new("UIGradient")
circleGradient.Color = ColorSequence.new({
    ColorSequenceKeypoint.new(0, Color3.fromRGB(255, 255, 255)),
    ColorSequenceKeypoint.new(0.7, Color3.fromRGB(245, 245, 245)),
    ColorSequenceKeypoint.new(1, Color3.fromRGB(230, 230, 230))
})
circleGradient.Rotation = 45
circleGradient.Parent = circle

local innerGlow = Instance.new("Frame")
innerGlow.Size = UDim2.new(0.8, 0, 0.8, 0)
innerGlow.Position = UDim2.new(0.5, 0, 0.5, 0)
innerGlow.AnchorPoint = Vector2.new(0.5, 0.5)
innerGlow.BackgroundColor3 = Color3.fromRGB(255, 255, 255)
innerGlow.BackgroundTransparency = innerGlowTransparencyDefault
innerGlow.Parent = circle

local innerGlowCorner = Instance.new("UICorner")
innerGlowCorner.CornerRadius = UDim.new(1, 0)
innerGlowCorner.Parent = innerGlow

local toggle = false
local tweenInfo = TweenInfo.new(tweenTime, Enum.EasingStyle.Cubic, Enum.EasingDirection.InOut)

local function breatheEffect()
    while true do
        local breatheIn = TweenService:Create(ambientGlow, TweenInfo.new(breatheTime, Enum.EasingStyle.Sine, Enum.EasingDirection.InOut), {
            BackgroundTransparency = glowTransparencyActive,
            Size = UDim2.new(1, 8, 1, 8)
        })
        breatheIn:Play()
        task.wait(breatheTime)
        
        local breatheOut = TweenService:Create(ambientGlow, TweenInfo.new(breatheTime, Enum.EasingStyle.Sine, Enum.EasingDirection.InOut), {
            BackgroundTransparency = glowTransparencyDefault,
            Size = UDim2.new(1, 6, 1, 6)
        })
        breatheOut:Play()
        task.wait(breatheTime)
    end
end

local function rotateGradient()
    while true do
        circleGradient.Rotation = (circleGradient.Rotation + 1) % 360
        task.wait(rotateSpeed)
    end
end

coroutine.wrap(breatheEffect)()
coroutine.wrap(rotateGradient)()

button.MouseButton1Click:Connect(function()
    toggle = not toggle
    
    local circlePos = toggle and circleEndPos or circleStartPos
    local bgColor = toggle and glowColorActive or frameColor
    local glowColor = toggle and glowColorActive or glowColorDefault
    local innerGlowTransparency = toggle and innerGlowTransparencyActive or innerGlowTransparencyDefault
    local shadowTransparency = toggle and shadowTransparencyActive or shadowTransparencyDefault
    
    local circleTween = TweenService:Create(circle, tweenInfo, {
        Position = circlePos,
        Size = toggle and circleSizeActive or circleSizeDefault
    })
    local colorTween = TweenService:Create(frame, tweenInfo, {BackgroundColor3 = bgColor})
    local glowColorTween = TweenService:Create(ambientGlow, tweenInfo, {BackgroundColor3 = glowColor})
    local innerGlowTween = TweenService:Create(innerGlow, tweenInfo, {BackgroundTransparency = innerGlowTransparency})
    local shadowTween = TweenService:Create(softShadow, tweenInfo, {BackgroundTransparency = shadowTransparency})
    
    circleTween:Play()
    colorTween:Play()
    glowColorTween:Play()
    innerGlowTween:Play()
    shadowTween:Play()
end)

button.AutoButtonColor = false
button.BackgroundTransparency = 1
button.Size = frameSize
4 Likes