Colorpicker

Also has everything from ElementHandle. Lets the user pick a color or gradient, optionally with transparency.


Picked value	`Color3` or `ColorSequence` (+ transparency, rotation, animation, speed when enabled)
Created by	Section:AddColorpicker

Two kinds of value

There are two kinds of value to think about:

What the user picked: the static color or gradient they chose, saved to their config. Read with Peek*, subscribe with OnChange.
What you should draw right now: the same color, but if they enabled an animation it changes every frame. Read with Get*, subscribe with OnUpdate.

GetColor

picker:GetColor(): Color3

A single Color3 to draw right now. If they picked a gradient, you get its first color.

GetGradient

picker:GetGradient(): ColorSequence

The current ColorSequence. Single colors are wrapped as a one-stop gradient.

GetTransparency

picker:GetTransparency(): number

0..1. 0 if the picker doesn’t have a transparency slider.

GetRotation

picker:GetRotation(): number

Gradient rotation in degrees, including any animation.

GetSnapshot

picker:GetSnapshot(): ColorSnapshot

All four at once: { color, gradient, transparency, rotation }. See ColorSnapshot.

OnUpdate

picker:OnUpdate(callback: (snapshot: ColorSnapshot) -> ()): () -> ()

Runs every frame the displayed color changes: user picks and animation ticks. Your callback receives a snapshot.

() -> ()

Unsubscribe function.

OnChange

picker:OnChange(callback: (picked: Color3 | ColorSequence) -> ()): () -> ()

Runs only when the user picks a new color. Doesn’t fire on animation ticks.

OnColorChange

picker:OnColorChange(callback: (picked: Color3 | ColorSequence) -> ()): () -> ()

Same as OnChange.

OnTransparencyChange

picker:OnTransparencyChange(callback: (alpha: number?) -> ()): () -> ()

Runs only when the user changes the transparency slider.

PeekColor

picker:PeekColor(): Color3 | ColorSequence

The raw color the user picked, ignoring any animation.

PeekTransparency

picker:PeekTransparency(): number?

The transparency the user picked, or nil if the picker has no transparency slider.

SetState

picker:SetState(color: Color3 | ColorSequence): ()

Set the color or gradient (same as SetValue).

SetTransparency

picker:SetTransparency(alpha: number): ()

0 (opaque) to 1 (invisible).

SetRotation

picker:SetRotation(degrees: number): ()

Rotate the gradient.

SetAnimation

picker:SetAnimation(key: GradientAnimation): ()

Turn on an animation. Does nothing if it can’t apply (e.g. shimmer on a single color).

Animation	Works on
`"none"`	Anything. Turns animation off
`"shimmer"`	Gradients only. Spins the gradient
`"rainbow"`	Anything. Cycles through hues
`"blink"`	Pickers with a transparency slider only

SetSpeed

picker:SetSpeed(multiplier: number): ()

Animation speed. 1 is normal.

Example: paint a frame

local cp = section:AddColorpicker("fill", "Fill", Color3.fromRGB(255, 100, 100), 0)

local function paint()
    local snap = cp:GetSnapshot()
    frame.BackgroundColor3 = snap.color
    frame.BackgroundTransparency = snap.transparency
end

paint()
cp:OnUpdate(paint)

Example: only when the user picks something new

cp:OnChange(function(picked)
    print("user picked", picked)
end)

Overview

Layout

Base class

Widgets

Containers

Notifications

Two kinds of value

GetColor

GetGradient

GetTransparency

GetRotation

GetSnapshot

OnUpdate

OnChange

OnColorChange

OnTransparencyChange

PeekColor

PeekTransparency

SetState

SetTransparency

SetRotation

SetAnimation

SetSpeed

Example: paint a frame

Example: only when the user picks something new

​Two kinds of value

​GetColor

​GetGradient

​GetTransparency

​GetRotation

​GetSnapshot

​OnUpdate

​OnChange

​OnColorChange

​OnTransparencyChange

​PeekColor

​PeekTransparency

​SetState

​SetTransparency

​SetRotation

​SetAnimation

​SetSpeed

​Example: paint a frame

​Example: only when the user picks something new

Two kinds of value

GetColor

GetGradient

GetTransparency

GetRotation

GetSnapshot

OnUpdate

OnChange

OnColorChange

OnTransparencyChange

PeekColor

PeekTransparency

SetState

SetTransparency

SetRotation

SetAnimation

SetSpeed

Example: paint a frame

Example: only when the user picks something new