EyeDropper: open() method

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The EyeDropper.open() method starts the eyedropper mode, returning a promise which is fulfilled once the user has selected a color and exited the eyedropper mode.

Syntax

open()
open(options)

Parameters

options Optional

An options object to pass an AbortSignal signal:

signal Optional: An AbortSignal. The eyedropper mode will be aborted when the AbortSignal's abort() method is called.

Return value

A Promise that eventually resolves when the user selects a pixel color from the screen.

The promise resolves to an object with the following property:

sRGBHex: A string representing the selected color, in hexadecimal sRGB format (#aabbcc).

Exceptions

Exceptions are not thrown but returned when the Promise is rejected.

NotAllowedError DOMException: Thrown if open() is not called via a transient user activation.
InvalidStateError DOMException: Thrown if another eye dropper has already opened.
AbortError DOMException: Thrown if the user aborts the selection by pressing the Esc key or if the selection is aborted by an AbortController being passed as an argument to open().
OperationError DOMException: Thrown if the selection fails for other reasons.

Specifications

Specification
EyeDropper API # dom-eyedropper-open

Browser compatibility

BCD tables only load in the browser