How to pick colors anywhere on your Mac

macOS has a system color picker hidden inside individual apps and a Digital Color Meter that copies in the wrong format. Here is how to get a real system-wide color picker with hex output and the eight other formats designers actually need.

Published April 28, 2026 6 min read By John Sciacchitano

The macOS color picker exists. It is buried inside individual apps that need it (Pages, Keynote, Sketch, Figma desktop, the various drawing apps), accessed by clicking a color swatch in those apps' UI. There is no system-wide hotkey to grab a color from anywhere on screen and copy it as a hex value. So if you are looking at a website, a screenshot, a YouTube thumbnail, or somebody else's design and you want the exact color, the OS does not help you.

Apple does ship Digital Color Meter, in /Applications/Utilities. It picks from anywhere on screen, but its default copy format is RGB integers (something like 204 224 255) and the UI has not been meaningfully updated since Snow Leopard. You can switch it to hexadecimal in View, Display Values, but the copy goes as the displayed format and the workflow is awkward enough that nobody uses Digital Color Meter twice.

The fix is a small menu bar app that uses Apple's native loupe and writes the value in the format you actually want.

The native loupe Apple already shipped

One thing worth knowing: macOS Sonoma added a real public API for the loupe color picker called NSColorSampler. This is the precise pixel-grid magnifier you have probably seen in Sketch or Figma, with a tight pointer ring that snaps to individual pixels and reads the screen color underneath. Before NSColorSampler, third-party color picker apps had to roll their own loupe (and many of them did, with varying quality).

Modern Mac color picker apps just call NSColorSampler.sampleColor(), get a real NSColor back from Apple's own implementation, and convert it to whatever format the user wants. The loupe is not a third-party reimplementation, it is the same code Apple uses for its own color pickers. The only thing the user-facing app has to do well is the convert-and-copy step.

Option 1: TeenyColor ($4.99 once)

What I ship. Native Swift, $4.99 lifetime, 3-day free trial. Press a global hotkey, the native loupe appears, click a pixel, the color is copied in your default format. That is the whole interaction.

What is in there:

  • Native loupe via NSColorSampler. Accuracy is whatever the macOS color picker uses for its own work.
  • Nine output formats: Hex (uppercase, lowercase), RGB, RGB decimal, HSL, HSB, CSS rgba, SwiftUI Color, UIColor. Set your default; copy in any other format with a modifier-click.
  • Auto-copy to clipboard. The picked color is on the clipboard the moment you click. No "now click the copy button" extra step.
  • Color history. Every color you pick is saved with a timestamp. Click any item in history to re-copy in your current format.
  • Pinned colors. Pick a color, pin it, get fast access from a separate section in the popup. Useful for the brand colors you keep using.
  • WCAG contrast checker. Pick two colors, see whether they meet AA or AAA contrast for normal and large text. The actual WCAG 2.1 formula, not a half-implementation.
  • Color naming. Each picked color gets the closest CSS named color attached so you can recognize it in history.
  • Global hotkeys for picker, history, and pinned colors.

Things teenycolor does not do: cloud sync, palette generation from images, color blindness simulation, brand kit management. The opinion is that color picking should be small and fast, and palette tools belong in a separate app.

Option 2: ColorSlurp (freemium)

ColorSlurp by IdeaPunch is the polished freemium picker. The free tier covers basic pick-and-copy. The paid tier ($7.99 once for ColorSlurp Pro, or $14.99/year for the cloud-synced subscription) adds palette management, contrast checker, multi-format presets, and color blindness simulation. ColorSlurp also uses NSColorSampler on macOS Sonoma and later.

Pick if: you want zero cost (free tier is generous) or you specifically want palette tooling and color blindness simulation.

Option 3: Sip (subscription)

Sip is the long-running premium pick. Subscription, $1.99/mo or $19.99/yr. Best polish, deepest features. The recurring price is the catch. If you can absorb subscription pricing for a tool that does not have meaningful ongoing infrastructure costs, Sip is excellent. If you cannot, the alternatives above cover the same use cases for one-time fees.

Option 4: Digital Color Meter (free, built in)

Apple's Digital Color Meter ships in /Applications/Utilities. It picks colors from anywhere on screen. Functionally it works. The copy-format friction (defaults to RGB integers, switching to hex requires a View menu trip) means most Mac users open it once and look elsewhere.

Worth knowing about. Not a long-term solution.

Option 5: Browser DevTools (free, web only)

If you only ever pick colors from web pages, every modern browser has a built-in eyedropper inside DevTools.

Chrome and Edge: open DevTools, click any element, click the color swatch in the Styles panel, click the eyedropper icon. You can now pick from anywhere on the page.

Safari: Develop, Show Web Inspector, similar flow.

Firefox: Inspector, click color swatch, eyedropper.

Limited to web content. Useless for desktop apps, screenshots, or images outside a browser. Free if your needs are narrow enough.

Output formats, what each one is for

Quick reference for the formats teenycolor writes, since the format menu confuses people who have not used a multi-format picker before.

Hex (uppercase, #FF6B35). The default for web work. CSS, HTML, most design tools.

Hex (lowercase, #ff6b35). Same as above, lowercased. Some style guides require it. Some Tailwind setups prefer it.

RGB (rgb(255, 107, 53)). CSS-friendly explicit form, easier to mentally adjust by component.

RGB Decimal (1.000, 0.420, 0.208). The 0.0 to 1.0 range that NSColor, UIColor, OpenGL, Metal shaders, and color science papers use.

HSL (hsl(15, 100%, 60%)). Useful for theme generation. Adjusting lightness moves you up and down a shade band cleanly.

HSB (hsb(15, 79%, 100%)). The Photoshop/Figma color picker's native space.

CSS rgba (rgba(255, 107, 53, 1.0)). RGB with explicit alpha.

SwiftUI Color (Color(red: 1.0, green: 0.42, blue: 0.21)). Paste straight into SwiftUI source.

UIColor (UIColor(red: 1.0, green: 0.42, blue: 0.21, alpha: 1.0)). Paste straight into UIKit / Catalyst source.

Set your default to whichever format you reach for most often. -click on a history item to copy in a different format without changing the default.

The contrast checker, how to use it

teenycolor's contrast checker uses the WCAG 2.1 formula directly: relative luminance for each color, then the ratio. The output is a number like 4.6:1 plus a pass/fail badge for AA and AAA at normal text and large text sizes.

The thresholds you actually want to remember:

  • 4.5:1 minimum for normal text (AA).
  • 3.0:1 minimum for large text (AA, where "large" is 18pt or 14pt bold).
  • 7.0:1 for AAA normal text.
  • 4.5:1 for AAA large text.

The contrast checker is the kind of tool you do not need until you do, then it saves you from shipping a UI nobody can read. Worth knowing about.

Common questions

Is the loupe accurate to the pixel?

Yes. NSColorSampler is the same machinery Apple uses, and it gives you a single pixel sample at the cursor position. On HiDPI displays, the sample is the rendered pixel, which is what you want for matching what the user sees.

Does it work on multi-monitor setups?

Yes. The loupe follows the cursor across displays. NSColorSampler handles multi-screen sampling natively.

Does it work with HDR content?

The loupe samples in the standard color space at the time of sample. HDR content is tone-mapped to the display's color space at render time, so what you sample is what is on screen, not the original HDR value. This is usually the correct behavior; if you specifically need scene-referred HDR values, that is a different category of tool.

What permissions does it need?

NSColorSampler uses Screen Recording permission, just like screenshot tools. macOS asks once on first use. There is no Accessibility requirement.

Why so many formats?

Because copy-paste is the friction point. If your daily workflow involves SwiftUI source, having "copy as Color(red: ...)" save you from hand-conversion adds up. If you live in CSS, having both hex and rgba one keystroke away matters.

Can it pick from a video frame?

Yes. The loupe samples whatever pixels the screen is currently rendering. Pause the video, sample, get the color.

The bottom line

A system-wide color picker is one of macOS's small persistent gaps that the indie market fills well. teenycolor at $4.99 is the cheapest paid path with all nine formats and the contrast checker. ColorSlurp's free tier is the cheapest free path. Sip is the subscription premium. Browser DevTools handle web-only picking for free.

Pick based on cost and what formats you reach for.

$4.99 once. Native loupe, nine formats, WCAG contrast.

teenycolor is the cheapest paid path to a Mac system-wide color picker. Native Swift, lifetime, 3-day free trial.