Design Essential•Live Color Studio•100% Client-Side

Color Picker

Interactive visual color spectrum with EyeDropper tool, real-time HEX, RGB, HSL, CMYK values, and shade palettes.

#3B82F6
#
HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)
CMYKcmyk(76%, 47%, 0%, 4%)
Lighter Tints (Mix with White)
#5895F7
#74A7F8
#90B8FA
#ACCAFB
#C7DCFC
#E3EDFE
Darker Shades (Mix with Black)
#1269F4
#0A56D1
#0845A7
#06347D
#042253
#02112A

Color Science & Standards

Conversions follow standard sRGB color space and W3C / WCAG 2.1 accessibility guidelines.

RGB(r, g, b) ⟷ HEX(#RRGGBB) ⟷ HSL(h, s%, l%) ⟷ CMYK(c, m, y, k)

How to Use Color Picker

01

Click the visual color swatch or type any HEX color code.

02

Use your browser's native EyeDropper tool to sample any pixel from your display.

03

Copy formatted HEX, RGB, HSL, or CMYK codes with one click.

04

Explore monochromatic tints (lighter) and shades (darker) in the palette gallery below.

Frequently Asked Questions

Does the EyeDropper tool work on external apps?

In supported browsers (Chrome, Edge, Opera), the EyeDropper API allows sampling colors from anywhere on your desktop screen.

What is CMYK used for?

CMYK (Cyan, Magenta, Yellow, Key/Black) is the subtractive color model used in commercial color printing, while RGB is used for digital screens.

Explore Companion Color Tools

Free client-side color pickers, converters, CSS gradient generators, and WCAG contrast tools.

View all 10 color tools