Color Picker
Pick any color from anywhere on your screen and instantly copy it in HEX, RGB, HSL, or HSB. After picking, a result panel appears near your cursor showing all formats, a generated palette, and your color history.
Getting Started
Requirements
Color Picker needs Screen Recording permission so it can read the color of pixels on your screen. If you haven't granted it yet, ProToys will let you know.
To grant it manually: open System Settings → Privacy & Security → Screen Recording and tick ProToys.
How to use
- Press ⌥⌘C from anywhere.
- A magnifying loupe appears — move your cursor over any pixel.
- Click to pick that color.
- A result panel pops up next to your cursor with all the formats.
- Click the copy button next to any format to copy it.
Press Esc while the loupe is active to cancel without picking a color.
Result Panel
Color Formats
The result panel shows the picked color in four formats simultaneously, each with its own copy button:
| Format | Example |
|---|---|
| HEX | #FF5733 |
| RGB | rgb(255, 87, 51) |
| HSL | hsl(14, 100%, 60%) |
| HSB | hsb(14, 80%, 100%) |
Color Name
The panel shows a friendly name for the color (e.g. Red, Green, Blue, Yellow). It's a best-guess label, not an exact CSS color name.
Generated Palette
A row of 7 swatches is generated automatically: three lighter tints, the picked color in the middle, and three darker shades. Click any swatch to switch the panel to that color.
Color History
A side strip shows your last 10 picked colors. Click any of them to bring it back. History sticks around between sessions.
Keyboard Shortcuts
| Action | Shortcut |
|---|---|
| Activate Color Picker | ⌥⌘C |
| Cancel picking | Esc |
Settings
| Setting | Description |
|---|---|
| Default format | Which format is shown first in the result panel: HEX, RGB, HSL, or HSB. |