Screen Picking & Color Conversion

Color Picker & EyeDropper

Pick colors from anywhere on your screen using the native EyeDropper API. Instantly convert between HEX, RGB, HSL, HSV, and CMYK, with real-time WCAG accessibility rating.

EyeDropper requires a Chromium desktop browser (Chrome, Edge). All color space math runs 100% locally with zero network latency or tracking.

EyeDropper API not supported in this browser. Use the interactive picker or sliders.
#3B82F6
Luminance: 0.235

Color Space Conversions

HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)
HSV / HSBhsv(217, 76%, 96%)
CMYK (印刷)cmyk(76%, 47%, 0%, 4%)

WCAG 2.1 Accessibility Contrast

Against Pure White (#FFFFFF)3.68 : 1
AA (≥4.5:1) FailAAA (≥7:1) Fail
Against Pure Black (#000000)5.71 : 1
AA (≥4.5:1) PassAAA (≥7:1) Fail

Color Harmonies & Palettes

Complementary (180°)
#3B82F6#F6AF3C
Analogous (±30°)
#523CF6#3CE0F6
Triadic (120°)
#F63C83#83F63C
Monochromatic Shades
🛡️100% Client-Side In-Browser Calculation · Zero Upload · Instant & Private

Methods & limits

Color Space Conversion Math & WCAG Contrast Mechanics

Web and digital displays operate on the sRGB color model. This tool accurately translates sRGB coordinates into intuitive polar cylindrical spaces (HSL/HSV) and subtractive print models (CMYK) to support both UI engineering and print prepress.

Accessibility contrast follows the W3C WCAG 2.1 specification, computing relative luminance by applying gamma expansion to RGB primaries before evaluating the luminance ratio against pure black and white.

Relative Luminance L = 0.2126*R + 0.7152*G + 0.0722*B (linearized sRGB); Contrast Ratio = (L1 + 0.05) / (L2 + 0.05).

FAQ

Color Picker & EyeDropper · FAQ

Which browsers support the EyeDropper API?

Modern Chromium browsers including Chrome 95+ and Edge 95+ support native screen sampling. On Safari or Firefox, you can freely use the interactive color canvas or direct value inputs.

Can I use the CMYK values directly for commercial offset printing?

The CMYK values provided here represent standard RGB-to-CMYK subtractive transformations ideal for design guides and quick color checks. For ISO coated prepress presswork, apply target ICC profiles.

Is any screen data captured or transmitted during eye-dropping?

No. The EyeDropper API is strictly sandboxed by the browser. Only the single sampled pixel's color value is returned upon user click; no screenshot or video stream is exposed.