EyeDropper Playground

Sample any pixel on your screen and get its hex color. No permission prompt, no screenshot plumbing.

#7c3aed

Click the button, then click any pixel, on this page, another app, anywhere. Press Esc to cancel.

History, click a swatch to copy its hex

Nothing picked yet.

The whole feature

async function pickColor() {
  const eyeDropper = new EyeDropper();
  const { sRGBHex } = await eyeDropper.open();
  // sRGBHex === "#3b82f6"
}

Chromium only. Chrome and Edge 95+. No Firefox, no Safari. Feature-detect with 'EyeDropper' in window and fall back to <input type="color">.
iPhone is out entirely, and no update will fix it. Apple requires every iOS browser to run on WebKit, so Chrome, Edge, and Firefox on iPhone are all WebKit under the hood. None of them have this API. It is a platform rule, not a version gap.
Needs a user gesture and HTTPS. You cannot open it on page load or from a timer.
Why no permission prompt is fine. The page never sees your screen. The browser asks the OS for one pixel and hands back a single hex string. One deliberate click buys exactly one color, the magnifier UI is browser-controlled, and Esc always cancels. Stealing anything meaningful one pixel per click is not a practical attack.
The real color-picker danger is elsewhere. Malicious browser extensions masquerading as color pickers have hit millions of users, but that is an extension-permissions problem, not this API. The web API is deliberately too narrow to abuse.