Eyedropper Color Picker

Point the eyedropper anywhere on your screen and get that color as HEX, RGB, and HSL. Click any value to copy it.

Click a value to copy it

How to Use

1
Pick a color

Press "Pick with eyedropper" and the cursor turns into a magnifier. You can sample from other applications too, not just this page. Press Esc to cancel.

2
Read and copy

HEX, RGB, and HSL are shown together. Click whichever line you need and it goes to your clipboard.

3
Reuse it later

Every color you pick stays in "Recent colors" below. Click one to return to it, or use the clear button to wipe the list.

FAQ

I do not see the "Pick with eyedropper" button.

Screen-wide color picking (the EyeDropper API) currently works only in desktop Chrome and Edge. On Safari, Firefox, and mobile the button is hidden — use the color picker instead.

Can I use an eyedropper in Safari?

On a Mac, press "Open color picker" and use the magnifier icon in the top-left of the system color window. That eyedropper comes from macOS itself, so it works regardless of browser. The Windows color dialog has no equivalent.

What if I want colors from an image?

To open a photo and sample a specific pixel or extract a whole palette, use the "Image Color Extractor" tool instead. This one samples whatever is already on your screen, with no file involved.

When do I use HEX vs RGB vs HSL?

HEX (#3B82F6) is the most common format in web and design tools. RGB maps to the three light primaries, which suits video and lighting work. HSL splits a color into hue, saturation, and lightness, which makes adjustments like "same color but a bit lighter" much more intuitive.

The picked color looks slightly off.

Your display's color profile (P3, sRGB, and so on) can make the on-screen value differ from the original. The eyedropper reads the pixel as actually drawn, so if you need the exact source value, check the color in the original file.