How to Get the Hex Code of a Color on Your Computer Screen

Download GIMP or another advanced image editor., Find an image with the color you're trying to match., Open the image with the color in question in GIMP. , Select the color picker tool., Click on the color you want to match in the image. , Click on...

8 Steps 1 min read Medium

Step-by-Step Guide

  1. Step 1: Download GIMP or another advanced image editor.

    GIMP is a free image manipulation software, but Photoshop and other advanced image editing programs will work, too, with very similar methods.
  2. Step 2: Find an image with the color you're trying to match.

    If the color you're matching is already in a picture saved on your computer, you can use that image.

    If you're trying to match a color on a webpage or computer program, you can take a screenshot that contains the color you're trying to match. ,, It looks like an eyedropper. ,, Locate the hex code
    - referred to as "HTML notation"
    - in the "Change Foreground Color" window that pops up.

    You can also select "Use info window" from the left-hand side color picker menu.

    Then, when you click your chosen color with the picker, the color info window will pop up, and the hex code will be listed there. , You can note it down, or right-click on the code and copy it to your clipboard.

    Then you can use that code in the font color, background color, or other elements in the HTML or CSS project you're creating.
  3. Step 3: Open the image with the color in question in GIMP.

  4. Step 4: Select the color picker tool.

  5. Step 5: Click on the color you want to match in the image.

  6. Step 6: Click on the foreground color box

  7. Step 7: now that it reflects your chosen color.

  8. Step 8: Use the hex code.

Detailed Guide

GIMP is a free image manipulation software, but Photoshop and other advanced image editing programs will work, too, with very similar methods.

If the color you're matching is already in a picture saved on your computer, you can use that image.

If you're trying to match a color on a webpage or computer program, you can take a screenshot that contains the color you're trying to match. ,, It looks like an eyedropper. ,, Locate the hex code
- referred to as "HTML notation"
- in the "Change Foreground Color" window that pops up.

You can also select "Use info window" from the left-hand side color picker menu.

Then, when you click your chosen color with the picker, the color info window will pop up, and the hex code will be listed there. , You can note it down, or right-click on the code and copy it to your clipboard.

Then you can use that code in the font color, background color, or other elements in the HTML or CSS project you're creating.

About the Author

C

Catherine Stevens

Dedicated to helping readers learn new skills in lifestyle and beyond.

119 articles
View all articles

Rate This Guide

--
Loading...
5
0
4
0
3
0
2
0
1
0

How helpful was this guide? Click to rate: