CSS Color Picker

 

Color Picker Background

#
R H
G S
B V

 
Hex
RGB
HSL
HSV
HWB
CMYK

Choose Multiple Colors

Compare up to 3 colors. Click in a field below, then select a color from the color picker... Try it!

How to Use this Color Picker

  1. Change the Hue

    Use the slider in the middle to change the hue.

  2. Pick a Color

    Click anywhere in the large square (on the left) to pick a color.

  3. Copy the Color

    Once you're happy with the color, copy any of the color values from the color codes table. For example #FFFFFF for the hex code, or rgb(255, 255, 255) for the RGB decimal equivalent.

  4. Compare Colors (optional)

    You can compare up to three colors by clicking in the Color 1, Color 2, Color 3 fields under the color picker.

    After clicking in one of the fields, select a color from the color picker. The selected color will automatically appear as the background color in the field that you selected. Repeat for the remaining colors.

Named Colors

There's also a named colors chart that you can use to pick colors by name instead of a code. Includes the hex and RGB equivalent for each name.