eyedropper

Retrieve a color using the eyedropper from the right-click context menu.

Aby zainstalować ten skrypt, wymagana jest instalacje jednego z następujących rozszerzeń: Tampermonkey, Greasemonkey lub Violentmonkey.

You will need to install an extension such as Tampermonkey to install this script.

Aby zainstalować ten skrypt, wymagana jest instalacje jednego z następujących rozszerzeń: Tampermonkey, Violentmonkey.

Aby zainstalować ten skrypt, wymagana będzie instalacja rozszerzenia Tampermonkey lub Userscripts.

You will need to install an extension such as Tampermonkey to install this script.

Aby zainstalować ten skrypt, musisz zainstalować rozszerzenie menedżera skryptów użytkownika.

(Mam już menedżera skryptów użytkownika, pozwól mi to zainstalować!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

Będziesz musiał zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

Będziesz musiał zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

Musisz zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

(Mam już menedżera stylów użytkownika, pozwól mi to zainstalować!)

// ==UserScript==
// @name         eyedropper
// @name:en      eyedropper
// @name:ja      スポイト
// @namespace    https://greasyfork.org/ja/users/941284-ぐらんぴ
// @version      2025-12-09
// @description  Retrieve a color using the eyedropper from the right-click context menu.
// @description:en Retrieve a color using the eyedropper from the right-click context menu.
// @description:ja 右クリックメニューからスポイト機能が使えます。
// @author       ぐらんぴ
// @match        http*://*/*
// @icon
// @run-at       context-menu
// @license      MIT
// ==/UserScript==

async function pickColorAndShow() {
    if (!window.EyeDropper) {
        alert('This browser does not support the EyeDropper API.');
        return;
    }
    try {
        const eye = new EyeDropper();
        const { sRGBHex } = await eye.open();
        const hex = sRGBHex.toUpperCase();
        const rgb = hexToRgb(hex);
        if (!rgb) {
            alert('Failed to retrieve color: ' + hex);
            return;
        }
        const rgbText = `RGB(${rgb.r}, ${rgb.g}, ${rgb.b})`;
        const out = `${rgbText}  ${hex}`;
        // 表示
        alert(out);
        try {
            await navigator.clipboard.writeText(`${hex}`);
        } catch (e) {
            console.warn('Clipboard write failed', e);
        }
    } catch (err) {
        console.error('EyeDropper error', err);
        if (err && err.name === 'AbortError') {
        } else {
            alert('error: ' + (err && err.message ? err.message : err));
        }
    }
}

function hexToRgb(hex) {
    const m = /^#?([0-9A-F]{6})$/i.exec(hex);
    if (!m) return null;
    const v = m[1];
    return {
        r: parseInt(v.slice(0, 2), 16),
        g: parseInt(v.slice(2, 4), 16),
        b: parseInt(v.slice(4, 6), 16),
    };
}

(async function init() {
    await new Promise((r) => setTimeout(r, 50));
    pickColorAndShow();
})();