Something wrong with this tool?

About Wheel Color Picker Online

This tool is an interactive color wheel that lets you pick any color visually. Click or drag on the wheel to choose hue, adjust saturation and brightness with sliders, and the tool shows the exact hex, RGB, HSL, and HSV values for use in any application.

Visual color picking is much faster than typing hex values when you need to fine-tune a shade. Designers, developers, and artists use color wheels to explore tones, find complements, and pick exact colors that match a reference.

The picker supports common color spaces and can convert between them on the fly. Save your favorite colors as a palette to reuse across designs.

How to use this tool

How to pick a color from the HSL wheel

  1. Drag the hue wheel

    "Hue (0–360)" is the angle on the color wheel — 0/360 is red, 120 green, 240 blue. Drag the wheel on the canvas or type the angle directly. Default is 210 (a cool blue).

  2. Pick saturation

    "Saturation %" controls colorfulness: 0 = neutral grey, 100 = fully saturated. Mid-saturation (50–70) looks natural; very high values can vibrate on screen. Default 70.

  3. Pick lightness

    "Lightness %" controls brightness: 0 = black, 50 = pure hue, 100 = white. Use 50 to get the most-saturated version of a hue; pull up/down for tints/shades. Default 50.

  4. Press Run

    Result returns rgb {r,g,b}, hex (#rrggbb), hslCss (`hsl(H S% L%)` ready for CSS), and rgbCss (`rgb(r, g, b)`). Pair with hex-to-rgb-converter or rgb-to-hex-converter for quick exchanges.