Graphic designers, web developers, and digital artists frequently encounter situations where they see a specific color on their screen—perhaps in a photograph, a corporate logo, or a website interface—and need to replicate it exactly in their own project. The amateur approach is to take a screenshot, open an expensive image editor like Adobe Photoshop, and use the eyedropper tool to sample the pixel.
However, macOS includes a highly precise, built-in utility designed specifically for this task. It is called the Digital Color Meter, and it allows you to hover your mouse over any pixel on your entire screen and instantly extract its exact color code in multiple industry-standard formats, without needing any third-party software.
Where to Find the Digital Color Meter
Like many of Apple’s most powerful technical utilities, the Digital Color Meter is hidden away in a sub-folder to keep the main Applications folder uncluttered.
- Click on your desktop to ensure Finder is active.
- In the top menu bar, click Go, then select Utilities.
- Scroll through the list until you find the application named Digital Color Meter (its icon looks like a small magnifying glass over a color spectrum).
- Double-click to launch it.
The fastest alternative is to press Command + Space to open Spotlight Search, type “Digital Color Meter”, and press Return.
How to Use the Meter
When the app opens, you will see a small, floating window that acts as a live magnifying glass. As you move your mouse cursor across your screen—over web browsers, videos, or desktop wallpaper—the window displays a highly zoomed-in view of the pixels directly beneath your pointer.
The specific pixel in the exact center of the crosshairs is actively being measured, and its precise mathematical values are displayed on the right side of the window.
If your hands are shaky and you are struggling to keep the crosshairs perfectly still on a single pixel, press Command + L (or click View > Lock Position in the menu bar). This freezes the meter’s reading so you can safely move your mouse away without losing the data.
Choosing the Right Color Format
Different software applications require color data in different mathematical formats. The Digital Color Meter can output exactly what you need. Click the drop-down menu in the center of the window to change the format:
- Display native values: Shows the raw RGB (Red, Green, Blue) values based on your specific monitor’s color profile. This is usually what you want for general design.
- sRGB / P3: Shows the values translated into standardized color spaces, vital for professional photo editing or app development.
- L*a*b* / XYZ: Highly advanced mathematical color models used in industrial printing and colorimetry.
How to Copy the Color as a Hex Code
If you are doing web development or CSS design, you almost certainly need the color as a Hexadecimal code (e.g., #FF5733). The Digital Color Meter does not display Hex codes visually in the window, but it will secretly format the data as a Hex code when you copy it to your clipboard.
- Hover over the exact color you want.
- Lock the position if necessary (Command + L).
- Press Shift + Command + C (or click Color > Copy Color as Text in the top menu bar).
By default, this shortcut copies the raw RGB numbers. To force the app to copy as a Hex code, you must change a setting in the top menu bar:
- Click View in the top menu bar.
- Hover over Display Values.
- Select as Hexadecimal.
Now, whenever you press Shift + Command + C, a perfectly formatted, web-ready Hex code is saved to your clipboard, ready to be pasted directly into your code editor or design software.