Gradient Text Generator
Fill headline text with a gradient, and keep it selectable.
Pick a colour from anywhere on your screen.
Or drop an image and sample from it
The file never leaves your device
Click anywhere on the image to sample it.
The colour appears here
The Eyedropper Color Picker uses the browser EyeDropper API to sample a colour from anywhere on your screen — another tab, an app, a video — and falls back to picking from an uploaded image where that API is not available.
Click the eyedropper, then click anywhere on your screen — another tab, a design tool, a video, a PDF — and the colour under the cursor is captured with every notation ready to copy. No extension, no download.
This uses the browser EyeDropper API, which is a deliberately careful piece of design. A page cannot read your screen: the picker is drawn by the browser itself, you choose the pixel, and only that one colour is handed back. The page never sees anything else.
Support is the catch — the API is in Chrome, Edge and Opera but not Safari or Firefox — so the tool falls back to picking from an uploaded or pasted image, which works everywhere. Drop a screenshot in and sample from it, with a magnifier for pixel-level accuracy and an average-over-area option for photographs, where a single pixel is rarely the colour you actually want. Every colour you pick is kept in a session history so a sampling run does not mean copying one value at a time.
Other tabs, other applications, video and PDFs — the browser samples the display, not the page.
The browser draws the picker and returns only the pixel you click. The page never sees your screen.
Drop a screenshot in where the API is unavailable, which covers Safari and Firefox.
Land on the exact pixel, or average an area — which is what a photograph usually needs.
Every colour you pick is kept, so a sampling run does not mean copying one value at a time.
Then click anywhere on your screen, in any application.
A screenshot or a photograph, if your browser has no eyedropper.
The magnifier shows individual pixels; the average option samples an area.
Every colour you picked is kept for the session, in any notation.
Chrome, Edge and Opera on desktop. Safari and Firefox do not implement the EyeDropper API, and on those the tool uses the image-based picker instead, which works the same way once you have a screenshot.
No. The browser draws the picker and returns only the single colour you click. The page has no access to your screen contents at any point, which is the whole design of the API.
Usually antialiasing — the pixel under the cursor on the edge of text or an icon is a blend rather than the real colour. Use the magnifier to land in a solid area, or sample an average over a region.
Yes. The eyedropper works over anything on screen, including video, PDFs and other applications, because the browser is sampling the display rather than the page.
What people who use the Eyedropper Color Picker think of it. Reviews come from visitors and are posted as written.
No ratings yet
Yours would be the first.
0 reviews
Newest first
No reviews yet
Be the first to rate the Eyedropper Color Picker. It takes half a minute and no account.
Write the first reviewFill headline text with a gradient, and keep it selectable.
Convert LCH to HEX and RGB — LAB in polar form, as CSS uses it.
Build CSS linear and radial gradients visually and copy the code.
Pick colours in OKLCH, the space modern CSS is built on.
Build a duotone pair and get the CSS to apply it.
Score every colour in a palette against every other one.
Check any text and background pair against WCAG AA and AAA.
Build tints, shades and tones from one colour.