Using the Google color picker, and grabbing the colors it can't reach

Open it

Search Google for "color picker"

Formats

HEX, RGB, CMYK, HSV and HSL

Can't do

Pick a color from a web page, an image or your screen

Price

Free, nothing to install

Type "color picker" into Google and a working tool appears above the results, with a color square, a hue slider and the code for your color in five formats. We tested it on Google's own blue, #1a73e8, and the conversion worked. What it can't do is pick up a color from a web page or a photo, so further down we tried two tools that can.

How to use Google's color picker

1. Search Google for color picker. The tool opens at the top of the results. In some regions it's titled "Colour picker."
2. Drag the circle in the square to set brightness and saturation, and the slider below it to change the hue.
3. Click the copy icon next to the HEX field to copy the code, or the share icon to share it.

Above the tool, Google suggested Extension, From image, From screen, Hex code and Wheel as follow-up searches. Most of those are things this tool can't do.

Convert a color code

The most useful trick is typing into the fields. Paste a code into HEX and the other four update at once. We entered #1a73e8, a blue used across Google's own products:

What Google's color picker can't do

• Sample a color from a web page. There's no eyedropper, so you can't click a button on a site and get its color.
• Read a color from an image. You can't upload a photo or a screenshot.
• Remember anything. There's no history and no saved palette, and the color resets when you leave the page.
• Suggest colors that go together. No shades, tints or harmonies.

Chrome color picker: pick a color from any website

Without installing anything: Chrome DevTools

Chrome has its own eyedropper, tucked into the developer tools. Right-click the page and choose Inspect. In the Styles pane, click any small color square next to a CSS color value. The DevTools color picker opens, and its eyedropper icon lets you click anywhere on the page to sample a color. It works, but it's built for developers: several clicks every time, and the color lands in the page's code until you copy it out. The same developer tools can also save a whole page as one image, which we used in our guide to taking a screenshot on a Chromebook.

With one click: a color picker extension

An extension saves you the trip into DevTools. The free color picker extension for Chrome from colorspicker.net puts an eyedropper button in the toolbar. Click it, click a spot on the page, and the HEX code is copied; earlier picks stay in a history list. There\'s also an eyedropper add-on for Edge.

Pick a color from an image

For a photo, a screenshot or a logo file, use an online color picker from image. On colorspicker.net you drop the file on the page, it builds a palette of the main colors automatically, and you can click any pixel to read its exact value.

We tested the palette with one of our own images, where we knew the answer: the orange stripe is #d9481a in our stylesheet. The palette's orange swatch came back as #DA4B1B.

That's 1 point off in red, 3 in green and 1 in blue. Our guess is that the swatch averages a patch of similar pixels instead of reading a single one. Nobody would notice on a mood board, but if you're matching a brand color, click directly on the color in the image and check the code it gives you.

Shades, tints and colors that go together

colorspicker.net has a page for every HEX code. Our blue has its own #1a73e8 color page, which gives royalblue as the nearest named color and lists the code in eight formats, including XYZ, LAB and LCH, which Google's tool doesn't show. It also shows shades and tints in 10% steps, six harmonies (complementary, split-complementary, triadic, analogous, monochromatic and tetradic) and a button to turn any of them into a CSS gradient.

Which tool to use

In an image prompt, give the HEX code instead of "dark blue" if you care about the exact shade. And if you ask Google AI Mode or a chatbot for a palette, paste its codes into Google's picker to see the colors before you use them.

Color picker questions