Colors are recognized in HTML and CSS through their hexadecimal codes. If you're aiming to create a webpage or another HTML project and want to add an element with a color from an image, website, or your computer screen, you'll need to find that color's hexadecimal code. This guide will walk you through various free tools to quickly identify any color's code.
Steps
Use Digital Color Meter on Mac

Launch Digital Color Meter on your Mac. This built-in tool on macOS allows you to identify the color values of any color on your screen. To open it, go to Finder, double-click on the Applications folder, then the Utilities folder, and double-click on Digital Color Meter to start the app.

Move the cursor to the color you wish to identify. As you move the mouse, the value in the tool will update in real-time. Make sure not to move the mouse away from this spot until you have locked both the horizontal and vertical apertures.
- You can also use this tool to identify colors on a webpage. Just open Safari (or your preferred browser) and visit the webpage containing the color you want to identify.

Press ⌘ Command+L. This action locks the horizontal and vertical apertures, meaning the color value will not change as you move the mouse.

Press ⇧ Shift+⌘ Command+C to copy the hexadecimal code to the clipboard. You can also copy the code by clicking on the Color menu and selecting Copy Color as Text.

Press ⌘ Command+V to paste the copied code. You can paste the code directly into HTML, text files, or any data entry fields.

Press ⌘ Command+L to unlock the aperture. If you wish to identify another color, this action will immediately unlock the tool, turning the cursor into the color picker again.
Using Color Cop on Windows

Install Color Cop. This is a free utility that allows you to quickly identify the hex code of any color on your screen. To install the application, follow these steps:
- Go to http://colorcop.net/download in your web browser.
- Click on colorcop-setup.exe under "self-installing". If the file does not download automatically, click Save or OK to start the download.
- Double-click the downloaded file (usually found in the Downloads folder at the bottom-left corner of your browser window).
- Follow the on-screen instructions to complete the installation.

Launch Color Cop. You can find the application in the Start menu.

Drag the eyedropper icon to the color you want to identify. You can identify any color on the screen, including colors in other applications or websites.

Release the mouse button to view the hex code. The code will immediately appear in the center field of the application.

Double-click the hex code and press Ctrl+C. This will copy the hex code to your clipboard.

Paste the code where needed. You can use Ctrl + V to paste the hex code anywhere, such as into HTML or CSS code.
Using Imagecolorpicker.com

Visit https://imagecolorpicker.com on your computer, phone, or tablet. This free tool lets you identify the hex code of any color in an uploaded image. It works on any browser on Android, iPhone, or iPad.

Upload an image or enter a URL. You can either upload an image from your device or use a photo or website from the web. Both methods will display the image or site for you to choose the color.
- To upload an image, scroll down and select Upload your image, find the image on your device, and choose your upload method.
- To use a website, scroll to the "Use this box to get the HTML color code from a website" option, enter the URL, and click or tap Take website.
- To pick an image from a page rather than the entire site, enter the image URL in the "Use this box to get the HTML color code from a picture via this URL" field and click or tap Take image.
Nhấp hoặc chạm vào màu mà bạn muốn trong phần xem trước ảnh/trang. Thao tác này cho bạn xem mã màu thập lục phân ở bên dưới góc trái màn hình.

Nhấp hoặc chạm vào biểu tượng sao chép để sao chép mã thập lục phân vào bộ nhớ tạm. Đó là biểu tượng hai hình vuông chồng lên nhau ở bên phải mã thập lục phân. Bạn có thể dán mã vào mọi tập tin văn bản hoặc trường nhập dữ liệu.
Sử dụng Firefox (dành cho màu trên trang web)

Mở Firefox trên máy tính Windows hoặc Mac. Trình duyệt Firefox có công cụ Eyedropper miễn phí mà bạn có thể dùng để nhận diện mã thập lục phân của mọi màu trên trang web. Nếu máy tính có Firefox, bạn sẽ tìm được nó trong trình đơn Start (trên Windows) hoặc thư mục Applications (trên macOS).
- Bạn có thể tải Firefox miễn phí tại https://www.mozilla.org/en-US/firefox.
- Firefox chỉ cho bạn biết giá trị màu trên website. Bạn không thể dùng nó bên ngoài trình duyệt.

Truy cập trang web có màu cần nhận diện. Đảm bảo phần tử mà bạn cần tìm mã màu đang hiển thị trên màn hình.

Click on the ☰. This is the three horizontal lines icon located in the top right corner of Firefox.

Click on the Web Developer menu. A new menu will immediately appear.

Click on Eyedropper. The cursor will change into a large circle.

Click on the color you wish to identify. The hexadecimal color code will immediately display as you move the mouse over any area. Once you click, Firefox will copy the color's code to the clipboard.

Paste the code where needed. You can use the keyboard shortcut Control + V (on Windows) or Command + V (on Mac) to paste the hexadecimal color code into HTML, CSS, or any text file.
Advice
- There are numerous websites, browser extensions, and image editing programs that allow you to use a color picker tool to find the hexadecimal code.
- If you know the creator of the website with the color you're looking for, try asking them which hexadecimal code they used. Alternatively, you can open the source code of the website to locate the hexadecimal code there.
