Skip to content
M2TOOLKIT

Color Picker

Choose a color and get its codes in every common format.

  • Free
  • No sign-up
  • Runs in your browser
230°
67%
51%
Sample text
HEX#2C48D6
RGBrgb(44, 72, 214)
HSLhsl(230, 67%, 51%)
HSVhsv(230, 79%, 84%)
CMYKcmyk(79%, 66%, 0%, 16%)
CSS var--color-brand: #2c48d6;

Everything you type is processed in your browser. Nothing you enter is sent to our servers or stored by us.

How to use the Color Picker

  1. Pick a color with the color box or type a HEX code.
  2. Fine-tune hue, saturation and lightness.
  3. Copy the format you need.

What does this tool do?

HEX and RGB describe colors by their red, green and blue components. HSL — hue, saturation, lightness — is easier for humans to adjust: change lightness to get a lighter or darker version of the same color.

Why use it?

  • Get codes for CSS, design tools and brand guides.
  • Adjust colors intuitively with HSL.
  • Copy any format in one click.

One color, five formats

#2C48D6 is rgb(44, 72, 214), hsl(230, 67%, 51%), hsv(230, 79%, 84%) and cmyk(79%, 66%, 0%, 16%).

Privacy

Everything you type is processed in your browser. Nothing you enter is sent to our servers or stored by us. There's no account to create and nothing to install.

Last reviewed by the M2Toolkit team.

Other tools people use alongside the color picker.