Get a Hex Code From Any Image on Mac — No Photoshop, No App
Table of Contents
macOS has the Digital Color Meter app built in, and the system color picker includes a magnifying glass eyedropper. But both are designed to pick single colors from anywhere on screen — not to extract a full palette from an image file. For getting the precise hex code of a color within an image on Mac, a browser-based tool is faster than opening Photoshop, and more capable than Digital Color Meter.
What Mac's built-in tools offer for color picking
Digital Color Meter (in Applications/Utilities) reads the hex value of any pixel currently under your cursor, anywhere on screen. It is useful for picking from live websites or apps. The limitation: it requires you to hover over the exact pixel on a displayed image — you cannot load an image file directly.
Preview's eyedropper lets you sample colors from open images, but it shows values in other formats and requires opening Preview first.
Photoshop and Affinity Photo have excellent eyedropper tools but require paid software.
For extracting a full dominant color palette from an image file, none of the built-in Mac tools do the job directly.
Getting hex codes from images in the browser on Mac
Open the Kingfisher Color Extractor in Chrome, Safari, or Firefox on your Mac. Drag and drop any image file — from your Desktop, Finder, or Downloads — directly onto the tool's drop zone.
The tool extracts the 8 dominant colors instantly and shows each as a swatch with HEX and RGB values. Click any swatch to copy the hex code. For a specific pixel, click anywhere on the image preview to see the exact color at that point.
The workflow is roughly: drag image onto browser tab, get hex code, copy, done. Under 15 seconds.
Sell Custom Apparel — We Handle Printing & Free ShippingBrowser tool vs Digital Color Meter: when to use each
| Task | Better Tool |
|---|---|
| Sample a color from a live website on screen | Digital Color Meter |
| Sample a color from a native Mac app on screen | Digital Color Meter |
| Extract a full color palette from an image file | Browser tool |
| Get hex code from a photo without displaying it on screen | Browser tool |
| Export palette as CSS or Tailwind | Browser tool |
| Identify exact pixel without opening a separate app | Browser tool |
Digital Color Meter is a system utility with one job; the browser tool is purpose-built for image palette work. They complement each other rather than compete.
Tips for dragging images into the browser on Mac
The tool supports drag and drop from Finder. A few tips for smooth use on Mac:
- Drag image files directly from a Finder window onto the browser tab — the browser will activate and accept the file
- Right-click any image in Chrome or Safari and choose "Open Image in New Tab," then drag it to the color extractor tab
- From the Photos app, drag a photo directly to the browser window
- Screenshots are automatically saved to your Desktop — drag from Desktop to the tool
On macOS, CMD+Click a Finder file to copy its path, which can also be used to open the file directly in the browser's address bar for quick access.
Try It Free — No Signup Required
Runs 100% in your browser. No data is collected, stored, or sent anywhere.
Extract Colors FreeFrequently Asked Questions
Does this work on Apple Silicon Macs (M1, M2, M3)?
Yes. The tool runs in any modern browser and uses standard HTML5 Canvas APIs. It works identically on Intel and Apple Silicon Macs.
Can I use this with RAW photo files from a camera?
Most browsers cannot render RAW formats (CR2, NEF, ARW) directly. Convert the RAW to JPG or PNG first using Preview or Photos on Mac, then use the color extractor.
Kevin is a certified financial planner passionate about making financial literacy tools free and accessible. He covers personal finance calculators, investment tools, and budgeting guides.
More articles by Kevin →