G
GamutDesk

Interactive Color Wheel & Sliders

Bidirectional color picker with synchronized HSL, RGB, and HEX controls. Copy color codes with zero latency.

100% Client-SideZero Data Collection
Live Preview
#2563EB
rgb(37, 99, 235)
Quick Standard Swatches
RGB Channels (0 - 255)
Red37
Green99
Blue235
HSL Cylindrical Coordinates
Hue221°
Sat83%
Light53%
RGB Format
rgb(37, 99, 235)
HSL Format
hsl(221, 83%, 53%)
CMYK Ink
cmyk(84%, 58%, 0%, 8%)
CSS Variable
--color: #2563EB;

Technical Specification & Mathematical Principles

Color channels are synchronized in real-time using mathematical transformations between Cartesian sRGB space and cylindrical HSL coordinates.

Relative Lightness is computed as L = (max(R,G,B) + min(R,G,B)) / 2, while Saturation is normalized against available chromatic distance: S = delta / (1 - |2L - 1|).

Frequently Asked Questions

Bidirectional state binding ensures that adjusting any single color channel—whether Hue in HSL, Red in RGB, or typing directly into the HEX input—automatically updates all other representations instantaneously in sync.

Related Design & Color Instruments

Image Color Picker

Extract pixel colors from your images with pixel-level precision and an interactive magnifying loupe. Runs 100% locally in your browser.

Open Tool

Browser EyeDropper Tool

Sample any pixel color directly from your monitor or browser window using the native Chromium window.EyeDropper API.

Open Tool

Interactive Color Wheel

Explore color spectrums and geometric harmonies directly on an interactive 360-degree HTML5 canvas wheel.

Open Tool

Dominant Color Finder

Detect the single most prominent color in any image using 3D color histogram quantization off the main thread.

Open Tool