A Better Color Picker

The Shades Color Picker adds an additional pane to the standard Apple Color Picker. It is designed to help you choose colors by showing you grids of related colors. Shades uses Hue - Saturation - Brightness (HSB) color coordinates which many people find more intuitive than Red - Green - Blue (RGB) color coordinates. To use Shades, you choose a center color, a step size and a color coordinate (one of H, S or B) to hold constant. Shades then draws a grid of related colors:

Choose Your Color

Shades holds one of hue, saturation or brightness constant and varies the other two. Choosing H-B from the segmented control gives a grid where the saturation is held constant, the hue varies horizontally and the brightness varies vertically. Similarly, B-S holds the hue constant while varying brightness and saturation across the grid and H-S holds the brightness constant while varying hue and saturation.

Whenever you change the center color, Shades recalculates and redraws the grid. In addition to using the controls on the panel, you can set the center color by dragging and dropping a color chip on the center of the grid or the color well at the top of the panel.

The color well at the top of Shades shows the currently selected color - the color that will be sent as the selected color to your application. By default this is the center color of the grid, but you can make any other color in the grid the current color by clicking on it. This does not cause the grid to be recalculated or redrawn.

You can also drag a color chip from any of the color rectangles in the grid and drop it anywhere on any application or color well that accepts color drags.

Take a Closer Look

The size of the color grid may be set to 3 x 3, 5 x 5, 7 x 7, or 9 x 9.

Shades removes the normal restrictions on the maximum size of the Color Picker window (and sets them back to normal when you choose a different Color Picker). This means that you can make the window quite large if you want to get a good look at your colors.

To help you visualize a single color, a right click or control-click over a color in the grid will replace the grid with a rectangle of the chosen color while the mouse button is pressed. When you release the mouse, the color grid will return.

Pausing the mouse for a few seconds over one of the color rectangles brings up a tool tip that shows the color coordinates (in HSB and RGB) of the color under the mouse.

Which Applications Can Use Shades

After installing Shades in your Library/ColorPickers folder, any application which uses the standard Apple Color Picker will have access to Shades. You can use Shades with Adobe Photoshop if you set Photoshop to use the Apple Color Picker. You can do this in the Photoshop Preferences. Adobe Illustrator and a few other applications which have their own custom color picker cannot use Shades.

Download A Trial Copy

Download a trial copy of Shades. This is a 30 day, unrestricted trial. To purchase a license for Shades, go to the Chromatic Bytes online store.