🎯Screen Colour Picker

About this tool

Press Pick a colour from the screen and click any pixel, in another window, app, photo or website. The colour appears with HEX, RGB, HSL and OKLCH values to copy, and your last 16 picks sit in a row of swatches. In browsers without the eyedropper, open or paste a screenshot and click on it, or use the colour chooser.

How the browser eyedropper works

The EyeDropper API, available in Chrome, Edge and Opera on desktop, lets a web page offer the same screen-sampling tool found in design apps. When you start it, the browser shows its own magnifier and lets you click any pixel on your screen, including other applications. Only the colour you click is returned to the page as a hex value; the page never sees a screenshot or anything else on your screen, and no permission is stored. That makes it handy for matching a brand colour from a PDF, copying a colour from a photo, checking what a competitor's button uses or grabbing a shade from a design file. Each pick is converted to several formats: HEX for HTML and CSS, RGB, HSL for adjusting lightness and saturation, and OKLCH, a newer CSS colour format whose lightness matches how bright colours look to people, which makes it good for building consistent palettes. Safari and Firefox don't support the API yet, and nor do phones, so the tool also lets you open or paste a screenshot and click on it. Honest limits: on-screen colours pass through your display's colour profile, so a picked value can differ slightly from the colour in the original file, and screenshots may be colour-managed too. The image colour picker samples uploaded images, the colour converter converts formats and checks contrast, and the palette tool extracts dominant colours. Hex colour codes, explained explains colour codes.

Frequently asked questions