AnyTool
Your files never leave your device. All processing happens locally in your browser.

How do I pick a color from my screen or an image and get its HEX, RGB and HSL?

Open AnyTool Color Picker from Screen. On Chrome, Edge or Opera, click “Pick color from screen” and then click any pixel anywhere on your screen — even outside the browser — and the native EyeDropper returns its exact color; press Esc to cancel. In any browser (including Firefox and Safari), drop, upload or paste an image and hover for a magnifier loupe, then click the exact pixel to read it, or use the color box for manual selection. Every pick shows HEX, RGB, HSL and HSB with one-click copy, and a history strip keeps your recent colors (copy one, copy all, or clear). The EyeDropper reads a single pixel locally and uploaded images are processed entirely in your browser — nothing is uploaded.

  • Native EyeDropper API: click any pixel anywhere on your screen (Chrome / Edge / Opera)
  • Universal image picker with a magnifier loupe — works in every browser, no upload
  • Native color box for manual selection · HEX, RGB, HSL and HSB with one-click copy
  • Recent-colors history: copy one, copy all, or clear
  • 100% client-side — the EyeDropper reads one pixel locally, images never leave your device

What is

Color Picker from Screen (EyeDropper)

A screen color picker samples the color of a pixel and reports it in standard formats. AnyTool uses the browser’s native EyeDropper API (new EyeDropper().open()) to let you click any pixel anywhere on your screen on Chromium browsers, and provides a universal fallback that reads pixels from an uploaded image on an HTML canvas via getImageData() so it works in every browser. Picked colors are shown as HEX, RGB, HSL and HSB and kept in a local history.

Generators

Related terms

EyeDropper APIsRGB hexgetImageDataHEX colorRGBHSL

Frequently Asked Questions

Yes, on Chrome, Edge or Opera. The native EyeDropper API lets you click any pixel anywhere on your screen — even outside the browser — and returns its sRGB hex. Firefox and Safari don’t support it, so use the image picker instead.

On Chromium-based browsers (Chrome, Edge, Opera) in a secure https context, AnyTool calls the native EyeDropper API after you click the “Pick color from screen” button. A magnifier follows your cursor and clicking any pixel — including content outside the browser window — returns that pixel’s color as a #RRGGBB value; pressing Esc cancels cleanly. Firefox and Safari do not implement the EyeDropper API, so on those browsers you pick colors from an uploaded image or with the manual color box instead. The EyeDropper only ever returns the single pixel you click — it never captures or sends a screenshot.

Drop, upload or paste an image — it is drawn to a canvas in your browser and read with getImageData(). Hover for a magnifier loupe and click the exact pixel. The image is never uploaded.

The image picker works in every browser. Drop, upload or paste (Ctrl/⌘+V) any image and it is rendered onto an HTML <canvas> entirely in your browser; the temporary object URL is revoked the moment the image is drawn. Move your cursor over the canvas to see a magnified loupe showing the pixels around the cursor and the live hex, then click to read the exact pixel with getImageData(). Nothing is uploaded — all decoding, magnifying and pixel reading happen on your device.

Each picked color shows HEX, RGB, HSL and HSB with one-click copy, and a history strip keeps your recent picks — copy one, copy all, or clear.

Every pick is converted in the browser to HEX, RGB, HSL and HSB, each with its own copy button. A native color box lets you select or fine-tune a color manually and adds it to the history too. The history strip keeps your recent unique picks: click a swatch to re-select and copy it, copy the whole list at once, or clear it. Everything is computed locally and copies only go to your own clipboard.

Yes — it is 100% client-side. The screen EyeDropper works in Chrome, Edge and Opera (https, desktop); Firefox and Safari use the image picker. Nothing is uploaded.

The tool is entirely client-side: the EyeDropper reads a single pixel on your device, and uploaded images are processed in your browser and never sent anywhere. The native EyeDropper API is Chromium-only — Chrome, Edge and Opera on desktop, in a secure (https) context, started by a click — while Firefox and Safari do not support it, so the universal image picker and manual color box are the way to pick colors there. The EyeDropper returns only sRGB hex with no alpha channel, and colors read from an image reflect what is rendered to the canvas, so heavy compression or a wide-gamut display can shift a value slightly.

Detailed Explanation

Methodology

How the Screen and Image Color Picking Work

AnyTool Color Picker from Screen samples colors two ways, both entirely in the browser. For screen picking it feature-detects the native EyeDropper API ('EyeDropper' in window) and, on Chromium browsers (Chrome, Edge, Opera) in a secure https context, calls new EyeDropper().open() in response to a click; the promise resolves to { sRGBHex } for the single pixel you click anywhere on your screen — including outside the browser — and a thrown AbortError (Esc / dismiss) is handled silently. For the universal fallback it draws an uploaded, dropped or pasted image onto an HTML canvas (with willReadFrequently) and reads pixels with getImageData(); a magnifier loupe redraws the surrounding pixels at high zoom with imageSmoothing disabled so you can target the exact pixel. The temporary object URL is revoked the moment the image is drawn. Every picked color is converted client-side to HEX, RGB, HSL and HSB.

  • Screen picking uses the native EyeDropper API → { sRGBHex } for one pixel
  • EyeDropper requires Chromium, a secure (https) context and a user gesture
  • User cancel throws AbortError and is handled gracefully
  • Image fallback reads pixels via canvas getImageData() — works in every browser
  • Object URLs are revoked after draw; conversion to HEX/RGB/HSL/HSB is client-side
Use Cases

Formats, Magnifier Loupe, Manual Box and History

Each picked color is shown as HEX, RGB, HSL and HSB with a one-click copy button per format, alongside a large contrast-aware swatch. The image picker shows a magnifier loupe that follows the cursor (and works on touch by dragging and lifting), displaying the pixels around the cursor and the live hex so you can pick precisely. A native <input type="color"> box lets you select or fine-tune a color manually and adds it to the history. The recent-colors history strip keeps your unique picks: click a swatch to re-select and copy it, copy the entire list at once, or clear it. Images can be supplied by clicking to upload, dragging and dropping, or pasting from the clipboard (Ctrl/⌘+V).

  • One-click copy of HEX, RGB, HSL and HSB per pick
  • Magnifier loupe with a center crosshair for pixel-precise picking (mouse and touch)
  • Native color box for manual selection / fine-tuning
  • Recent-colors history: copy one, copy all, or clear
  • Upload, drag-and-drop, or paste an image from the clipboard
Privacy & Security

Browser Support and Privacy

The native EyeDropper API is Chromium-only: it works in Chrome, Edge and Opera on desktop in a secure context, and Firefox and Safari do not implement it, so on those browsers the tool surfaces the image picker and manual color box instead — both of which work everywhere. The EyeDropper returns only the single pixel you click as an sRGB hex value with no alpha channel; it never captures or transmits a screenshot. The image picker decodes and reads images entirely in your browser via canvas, never uploads them, and revokes the object URL after drawing. All conversions, the history and clipboard copies stay on your device, and the tool works offline once cached. Colors read from an image reflect what is rendered to the canvas, so heavy JPEG compression or a wide-gamut display can shift a value slightly.

  • EyeDropper is Chromium-only (Chrome/Edge/Opera, https); Firefox/Safari use the image picker
  • EyeDropper returns one pixel as sRGB hex (no alpha); never a screenshot
  • Uploaded images are read in-browser via canvas and never uploaded; object URLs revoked
  • History and copies stay on your device; works offline (PWA-cached)
  • Image values reflect canvas rendering — compression/wide-gamut can shift them slightly
Color picker from screen: in-browser (AnyTool) vs typical online/extension color pickers
CapabilityAnyToolTypical color pickers
Pick from anywhere on screenNative EyeDropper API (Chrome/Edge/Opera)Often needs an extension or app
Image color pickingBuilt-in canvas picker with magnifier loupeSometimes server-side upload
Works in Firefox / SafariYes — via the image picker fallbackEyeDropper unavailable, often no fallback
ProcessingRuns entirely in your browserSometimes uploads the image
FormatsHEX, RGB, HSL, HSB (one-click copy)Often just HEX/RGB
Manual selectionNative OS color box includedVaries
History / paletteRecent picks: copy one, copy all, clearFrequently missing
PrivacyOne pixel read locally; images never uploadedMay transmit or log
Cost / signupFree, no signup, no installOften an extension or gated

AnyTool uses the browser’s native EyeDropper for screen picking and a local canvas picker for images, converts to four formats with a recent-colors history, and uploads nothing.