How to Get Color Code Images and the Web

How to Get Color Code Images and the Web

Sometimes we see an image or user interface that has a very good color, so it makes us curious about what color to use. It’s actually quite easy to see how to get an image color code. You can get hex and RGB color codes in several ways such as with photoshop, paint, web colorpicker, etc.

There are thousands of colors that can be produced through a combination of Red, Green, and Blue. So it’s not surprising that people try to produce good colors for the images and applications they make. To express this curiosity, there are several ways to figure out the code for an image, and here are the steps.

How to Get the Color Code

Fetching the color code can use any application, but this time we will use Photoshop, Paint 3D and ColorPick Eyedropper installed in the browser extension. And well here’s how.

1. Knowing the Color Code with Adobe Photoshop

  • Download the image you want to know the color of, or a screenshot of the app or web view and save it in PNG or JPG format. If you feel the image size is too large, please resize the image to a smaller one.
  • Run Adobe Photoshop then open the image by clicking File → Open. And look for the image file that you downloaded earlier.

Adding Images to Photoshop

Or you can right click on the image, then select Open With → Adobe Photoshop.

Open With Adobe Photoshop

  • On the left menu of Photoshop, click the Eyedropper Tool.

Eyedropper Tool Adobe Photoshop

  • Then hover over the image you want to see the color code for, then click on the image.
  • Click on the Color section to see the color code.

Know the Image Color Code - Color

  • You can see the RGB and Hexa color codes, and you can copy the code.

Color Picker Photoshop

2. Getting Color Coded with Paint 3D

  • Open Paint 3D, then click Open → File, and find the image file that you downloaded earlier.
  • Click the Color Picker and hover over the image for which you want to see the color code.

Color Picker Paint

  • Then click on the color next to the color picker.

Capturing Color Codes Using Paint

  • You can see the Hexa and RGB color codes, please copy the code that you got.

Successfully Getting Image Color Codes Using Paint

3. Knowing the Color Code in a Web browser

If you’ve ever seen colors on a website have great colors, but are curious to get those colors. It’s very easy, you just need to install the extension on a browser that supports adding extensions. In this example I am using the Google Chrome browser.

  • Open Browser, then click the three dots in the upper right corner and select Settings.

Google Chrome Settings

  • Then click Extensions.

Google Chrome extension

Open the Chrome Webstore

  • In the search type ‘ColorPick Eyedropper‘.
  • And install the extension.

How to Get Color Codes Using the ColorPick Eyedropper

  • Click Colorpick Eyedropper on the top right corner of chrome, then hover over the color you want to see the Hexa and RGB codes. Then you will see the code.

Getting Color Coded with the ColorPick Eyedropper

  • Copy the code that you got.


And that’s three ways to get color code on images and the web, hopefully useful. If there is anything you want to ask, you can write it in the comments column. That’s all for me, thank you.

Leave a Reply

Your email address will not be published. Required fields are marked *