How to identify the color code used in an image

You can identify colors in any image using the eyedropper tool in an image editor, browser, or other supported program. Below are the steps for using this tool and an online eyedropper tool we've created to identify colors in an uploaded file.

Online eyedropper tool

The following tool uses JavaScript in your browser to identify the color codes of an image you upload. To start, click the below Browse button and choose the image on your computer you want to upload and identify its colors. This tool supports (GIF, JPEG, PNG, and other formats supported by browsers). Once the image is uploaded, hover your mouse pointer over any portion of the image to identify the colors. If you click any color, it'll appear in the Clicked colors section and link you directly to the color code on Computer Hope.

Hex:
RGB:
HSL:
Web safe:

Clicked colors:

Internet browser

In an Internet browser, you can find an eyedropper in DevTools that displays any website's source code. Below are the steps to finding the eyedropper tool in DevTools.

1. In DevTools, ensure you're viewing the Elements of the web page, which is the source code.
2. In the style section, filter the page by typing "color" in the filter box.
3. Click the small box next to any color code or color name to view the color selector. If there are no color styles, one can be added by clicking in the code section and typing "color:#00FF00;"
4. In the color selector, click the eyedropper icon to activate the tool.
5. Once activated, you can hover over any element or section of a picture to get the color code of any pixel.

Image editor

Any image editor, picture editor, or paint program has an eyedropper tool similar to the one in the picture. Once clicked, the mouse pointer changes to an eyedropper, and anywhere you click, the eyedropper grabs that color and makes it the active color.

Depending on the program you're using will depend on how you determine the color code of the selected color. Below are examples of how this could be done.

Microsoft Paint

1. Open Microsoft Paint and the picture you want to use.
2. Click the eyedropper in the Tools section.
3. Click the location of the image you want to identify the color code.
4. The color swatch in colors should change to that color.
5. Click the Edit colors icon next to the colors. This icon has a rainbow of colors with a + on the icon.
6. In the Edit colors window, you'll see the color code (e.g., something similar to #00FF00), the RGB color values, and the HSV color values if the RGB is changed to HSV.

Adobe Photoshop

1. Open Adobe Photoshop and the picture you want to use.
2. Click the eyedropper icon or press the "i" key on your keyboard.
3. Click the location of the image you want to identify the color code.
4. The color swatch in colors should change to that color.
5. Click the color swatch containing the color to open the Color Picker.
6. In the Color Picker window, you'll see the color code (e.g., something similar to #00FF00) and the RGB, HSB, and CMYK values.

Other image editor

If you're using another image editor, the steps should be similar to the above steps. Typically, you'll select the eyedropper from a tools area to select a color; once selected, edit the color to view its properties.