Color Picker
Pick a color and get HEX, RGB and HSL, harmony palettes, and colorblind previews.
#0D47A1
Colorblind preview
protanopia
deuteranopia
tritanopia
📐 About This Calculator
Choose a color and read its HEX, RGB and HSL values. Generate harmony palettes by rotating hue, and preview how the color appears to people with colorblindness.
HEX → RGB: split into R, G, B bytes
RGB → HSL: normalise, find max/min, derive hue, saturation, lightness
Harmony: rotate hue by 180° (complementary), 120° (triadic), ±30° (analogous)
Variable Definitions:
- • H, S, L = Hue, saturation, lightness
- • R, G, B = Red, green, blue (0–255)
✅ Best used for:
- • UI and brand design
- • Building accessible palettes
- • Converting between color formats
⚠️ Limitations:
- • Colorblind simulation is an approximation
- • sRGB color space only
📖 How Color Values are Calculated
HEX, RGB and HSL
HEX is a compact 6-digit code; RGB lists the red/green/blue channels; HSL describes hue, saturation and lightness — useful for building palettes.
Harmony palettes
Rotating the hue produces complementary, triadic, analogous and tetradic schemes that work well together.