Loading...
Pick any color and get instant HEX, RGB, HSL, and CMYK values. See complementary colors, recent color history, and copy values with one click.
A color picker is a tool that lets you select a color visually or by entering a value, then displays it in multiple formats (HEX, RGB, HSL, CMYK) for use in design and code.
#3B82F6
#C47D09
| Format | Best For |
|---|---|
| HEX | Web, CSS, design tools |
| RGB | Screens, JavaScript |
| HSL | Color manipulation, themes |
| CMYK | Print design, publishing |
Formula
Hex and RGB are the same number written two ways; HSL is that number expressed as hue, saturation and lightnessHex = two hexadecimal digits per channel, so #FF8800 is red 255, green 136, blue 0
RGB = the three channels as decimals from 0 to 255
HSL = hue in degrees around the colour wheel, saturation and lightness as percentages
Alpha = opacity from 0 to 1, written as a fourth channel or as a third pair of hex digits
Worked Example
Reading #FF8800
Did you know? Three digit hex is shorthand, not a different palette: #F80 expands to #FF8800 by doubling each digit, which is why only 4,096 of the 16.7 million sRGB colours can be written that way.
Sources
Convert text to ASCII codes and back. Supports decimal, hex, binary, and octal formats.
Calculate required internet bandwidth based on devices and activities in your household.
Encode and decode Base64 strings. Convert text for data URIs, APIs, and safe data transmission.
Create CSS border-radius with visual controls for each corner. Generate circles, pills, and custom shapes.
Create CSS box shadows with multiple layers, live preview, and copy-ready code.
Preview how colors appear with different types of color blindness. Test accessibility for color vision deficiency.