Что такое EyeDropper API
Это программный интерфейс браузера, который по запросу страницы открывает системный режим «пипетки»: курсор меняется, вы кликаете по нужной точке на экране, и страница получает выбранный цвет в формате sRGB (обычно как HEX). Страница не «видит» весь экран заранее — только тот пиксель, который вы явно выбрали после подтверждения в интерфейсе браузера.
Как пользоваться в Picksee
На главной странице сервиса на широком экране отображается кнопка «Выбрать цвет на экране». Нажмите её: браузер покажет диалог выбора цвета (внешний вид зависит от ОС и версии Chrome/Edge). После клика по нужному месту цвет появится в блоке результата вместе с HEX, RGB и HSL — его можно сразу скопировать.
Если вы передумали, обычно срабатывает клавиша Escape — режим пипетки закроется без выбора цвета.
Где работает, а где нет
Поддержка есть в современных версиях Google Chrome, Microsoft Edge и других браузеров на движке Chromium. В Safari и Firefox на момент написания статьи API может быть недоступен — в таком случае кнопка на экране скрывается, но остаются загрузка файла, вставка из буфера и работа по ссылке (если сервер картинки разрешает CORS).
На большинстве мобильных браузеров полноценной пипетки с экрана нет: интерфейс Picksee ориентирован на десктоп для этой функции.
Пипетка по картинке и пипетка с экрана — в чём разница
С экрана удобно снять цвет с чужого сайта, видео или интерфейса программы без сохранения скриншота. По загруженному изображению — когда у вас уже есть файл или вы хотите автоматическую палитру доминирующих цветов. В одном проекте часто используют оба способа по очереди.
Заключение
EyeDropper API делает сценарий «цвет с экрана» быстрым и привычным для верстальщиков и дизайнеров. Откройте онлайн-пипетку Picksee, попробуйте кнопку на десктопе и при необходимости дополните процесс загрузкой референса или вставкой скриншота из буфера.