How to Get the Hex Code of Any Pixel on Your Screen

By the Keynou team · July 17, 2026 · 5 min read

"What's the hex code of that?" is probably the most common color question there is - and the answer depends on where the pixel lives. Here is the complete map, from pixels inside a Chrome tab to pixels in a native app or a paused video.

Any pixel, one click: the extension route

The Chrome EyeDropper API can sample the entire screen, not just web content. That means an extension like Keynou Colorpicker handles every case with the same gesture:

1. Click the toolbar icon - the eyedropper opens immediately with a magnifier.
2. Move anywhere: another browser window, Figma, a video frame, a PDF, your desktop.
3. Click the pixel. The hex code is on your clipboard.

The magnifier matters more than it sounds. At 100% zoom, the pixel you think you are hovering is often not the pixel you get - anti-aliasing blends edges, and 1px UI details are smaller than your cursor. The loupe blows up the neighborhood so the crosshair lands exactly.

Windows: PowerToys Color Picker

1. Install Microsoft PowerToys (free, from Microsoft).
2. Press Win+Shift+C anywhere.
3. Scroll to zoom, click to capture - the picker shows HEX plus RGB/HSL and copies on click.

Solid tool. Its limits are workflow ones: it is a system-wide utility with its own settings window, so if your work happens in the browser (CSS, reviews, QA), you will be bouncing between contexts and re-copying formats.

macOS: Digital Color Meter

1. Open Digital Color Meter from Applications → Utilities (it ships with macOS).
2. Set the display dropdown to Display in sRGB and, in View → Display Values, choose Hexadecimal.
3. Hover any pixel and press Cmd+Shift+C to copy the value.

Inside a screenshot or image file

Already have the pixels in a file? Any image editor's eyedropper works (Photoshop, GIMP, even Preview's annotations picker) - but honestly, opening the image in a browser tab and using the extension is usually faster than launching an editor, and it drops the value straight onto your clipboard in the format your stylesheet expects.

Accuracy checklist

• Zoom before you click. Anti-aliased edges can be 30+ hex values away from the fill they border.
• Mind color management. Wide-gamut monitors and non-sRGB profiles can shift what a naive picker reports; browser-based picking reports the sRGB value the page actually uses.
• Verify on a flat area. Gradients and JPEG compression create noise; sample the center of a solid region when you can.

On Linux

Linux desktops have good options too. GNOME users can install GNOME Color Picker or use the screenshot tool's built-in picker; KDE ships KColorChooser, which has a "Pick Screen Color" button that samples any pixel. If you already work in Chrome or a Chromium browser on Linux, the extension route works identically to Windows and macOS - the EyeDropper API is part of the browser, not the operating system.

Getting the value into the format you actually need

Most OS pickers report HEX and RGB, but your next step usually wants something specific - a CSS variable, an RGBA with opacity, an HSL for a scale. Rather than converting by hand, pick with a tool that outputs every format at once and copies your default automatically. That turns "what's the hex of that" into a single click instead of a pick-then-convert chore. See our companion guide on HEX vs RGB vs HSL for when to use which.

Batch-sampling several colors

Building a palette from a reference image means grabbing many colors in a row. A picker with a history is far faster here than an OS tool that copies one value at a time: pick, pick, pick, then open the popup and every swatch is saved and re-copyable. Twenty recent colors is usually enough to reconstruct a full palette from a screenshot without breaking flow.

Scope note: on-screen vs. inside a web page

This guide covers pixels anywhere on your screen, including outside the browser. If you only need colors from a web page you have open, the browser-specific methods in how to pick a color from any website are quicker.

Sources

The browser method uses the EyeDropper API (MDN). Microsoft documents PowerToys Color Picker; Apple ships Digital Color Meter with macOS.