Pick a pixel. Ship a color system.

Mac pixel picker

Use one global hotkey to inspect any screen pixel, copy production-ready HEX, OKLCH, or SwiftUI code, and turn it into a complete Tailwind 50–950 scale. Private and local-first.

Free · optional Pro unlock macOS 13+No accountEnglish & 简体中文

Download on the Mac App Store Support

#4AA8FF rgb(74, 168, 255)

⌃ ⌥ C

01 — Capture

Pick anything.

The menu bar or a customizable global hotkey — Control + Option + C by default — puts a loupe under your cursor. Inspect the exact pixel, then copy. Temporary preview pixels are discarded when the picker closes.

Default copy is #RRGGBB — one click for the rest

Source

Tailwind scale 50–950 Signal Blue

02 — Systematize

Turn one color into a system.

Generate a full 50–950 shade range from any picked color. Name tokens, assign semantic roles, tag, and check WCAG contrast — saved to your local workspace only when you confirm.

03 — Ship

Ship it anywhere.

Export CSS custom properties, SwiftUI, Tailwind config, or JSON — or a PixelSpy archive with merge and replace modes. Your colors, your format, your Mac.

:root {  --brand-50: #04121f;  --brand-100: #0a2a45;  --brand-200: #155d99;  --brand-300: #2a8fd4;  --brand-400: #5fb0ea;  --brand-500: #8ec8f4;  --brand-600: #bcdff9;  --brand-700: #dbeefb;  --brand-800: #edf6fd;  --brand-900: #f8fbfe;  --brand-950: #ffffff;}

extension Color {  static let brand = Brand()  struct Brand {    let shade50 = Color(red: 0.016, green: 0.071, blue: 0.122)    let shade100 = Color(red: 0.039, green: 0.165, blue: 0.271)    let shade200 = Color(red: 0.082, green: 0.365, blue: 0.600)    let shade300 = Color(red: 0.165, green: 0.561, blue: 0.831)    let shade400 = Color(red: 0.373, green: 0.690, blue: 0.918)    let shade500 = Color(red: 0.557, green: 0.784, blue: 0.957)    let shade600 = Color(red: 0.737, green: 0.875, blue: 0.976)    let shade700 = Color(red: 0.859, green: 0.933, blue: 0.984)    let shade800 = Color(red: 0.929, green: 0.965, blue: 0.992)    let shade900 = Color(red: 0.973, green: 0.984, blue: 0.996)    let shade950 = Color(red: 1.000, green: 1.000, blue: 1.000)  }}

// tailwind.configtheme: {  extend: {    colors: {      brand: {        50: "#04121f",        100: "#0a2a45",        200: "#155d99",        300: "#2a8fd4",        400: "#5fb0ea",        500: "#8ec8f4",        600: "#bcdff9",        700: "#dbeefb",        800: "#edf6fd",        900: "#f8fbfe",        950: "#ffffff",      },    },  },}

{  "palette": "Signal Blue",  "source": "#2A8FD4",  "shades": {    "50": "#04121f",    "100": "#0a2a45",    "200": "#155d99",    "300": "#2a8fd4",    "400": "#5fb0ea",    "500": "#8ec8f4",    "600": "#bcdff9",    "700": "#dbeefb",    "800": "#edf6fd",    "900": "#f8fbfe",    "950": "#ffffff"  }}

Features

Built for people who ship color

Design systems

Seed a token set from any pixel on screen.

App theming

SwiftUI and UIColor output, P3-aware.

Web development

Tailwind 50–950 scales in one hotkey.

Accessibility

WCAG contrast before you commit.

Pricing

Free to start. Upgrade only if you need it.

Free

Menu bar app and global hotkey
Loupe and pixel sampling
HEX, RGB, and HSL copy
Display P3 aware picking
Unlimited local history, search, favorites, and notes
Customizable hotkey, login item, and copy behavior

PixelSpy Pro — one-time unlock

$9.99

50–950 color scale generation
OKLCH, SwiftUI, UIColor, NSColor, Tailwind tokens, and Lab
WCAG contrast checks
Projects, token names, semantic roles, and tags
Export to JSON, CSS, SwiftUI, Tailwind, or PixelSpy archive
Duplicate and token-conflict checks

The in-app unlock is listed as US$9.99. Local price and tax are shown on Apple’s purchase sheet. Not a subscription.

Prices are confirmed on the Apple purchase sheet before you buy. Restore Purchases is available in the app.

Privacy

No account and no cloud workspace.
Screen Recording reads only the pixel you choose — screen content never uploads.
History, projects, and notes stay on your Mac.

Read the privacy policy

FAQ

Why does PixelSpy need Screen Recording permission?

macOS requires Screen Recording permission for any app that reads screen pixels. PixelSpy uses it only to read the pixel you choose. It does not record video or audio and does not upload screen content.

Where is my data stored?

Color history, projects, notes, tags, and preferences stay on your Mac. There is no PixelSpy account and no cloud sync. Import and export only use files you select in the macOS file picker.

Which macOS versions are supported?

PixelSpy requires macOS 13 (Ventura) or later.

Which languages are available?

The App Store listing includes English and Chinese. Simplified Chinese is shown when the system language is Simplified Chinese.

Does PixelSpy use crash reporting?

PixelSpy may use Firebase Crashlytics for crash reports (stability only, not advertising). See the privacy policy for what that report can include.

How do refunds work?

Purchases are processed by Apple. Request a refund at reportaproblem.apple.com. We cannot issue App Store refunds ourselves.

Pick your next color on the Mac

Free to download. Optional one-time Pro unlock. No subscriptions and no account.

Download on the Mac App Store Free · optional Pro unlock