Edit one opaque colour through a visual plane, hue, channels, presets, or screen sampling. Every control is another view of the same value; format changes representation, never colour.
Drag the plane, use its arrow keys, move hue, switch formats, edit channels, choose a preset, or try the sampler. The sampler falls back to the browser’s native colour input when EyeDropper is unavailable.
| Format | Channels | Boundary |
|---|---|---|
| HEX | Hex triplet | Portable opaque web value |
| RGB | Red, green, blue | Each channel clamps to 0–255 |
| HSL | Hue, saturation, lightness | The plane switches its vertical axis to lightness |
| HSB | Hue, saturation, brightness | Also called HSV; the plane’s default model |
| Verdict | Rule |
|---|---|
| Do | Name the property being edited, keep every representation synchronized, and preserve the last meaningful hue through grey and black. |
| Do | Keep the 2D plane keyboard-operable and retain native Slider behavior on hue. |
| Don’t | Use this when a short product palette is the complete choice set; use labelled swatches instead. |
| Don’t | Add alpha unless the stored value and every downstream consumer support it. |