Chromascope for Photoshop

Requirements: Adobe Photoshop 2023 (v23.3.0) or later on macOS or Windows.

Option A: Download the release

1. Download the ZIP for your platform from the Download page.
2. Unzip the archive. You will find a Chromascope-Photoshop folder.
3. Open Photoshop and go to Plugins → Development → UXP Developer Tool.
4. In the UXP Developer Tool, click Add Plugin and select the manifest.json inside the Chromascope-Photoshop folder.
5. Click Load to activate the plugin.

Option B: Build from source

git clone https://github.com/kevinkiklee/chromascope.git
cd chromascope
./scripts/setup.sh
npm run build:plugins

Then load plugins/photoshop/manifest.json via the UXP Developer Tool as described above.

Once installed, open the Chromascope panel from the menu:

Plugins → Chromascope → Chromascope

The panel can be docked alongside your other Photoshop panels or left floating. It works best at its preferred docked size of 350×700 pixels, but will adapt to any size above 300×500.

The vectorscope activates automatically when you have a document open. If no document is open, the panel displays an empty graticule.

The vectorscope plots every pixel’s chrominance on a circular graph:

• Angle — represents the hue. Red at 0°, Yellow at 60°, Green at 120°, Cyan at 180°, Blue at 240°, Magenta at 300°.
• Distance from center — represents saturation or chroma. The center is neutral gray; the rim is maximum saturation.

Graticule elements

• Concentric rings at 25%, 50%, 75%, and 100% mark saturation levels.
• Crosshair marks the neutral center.
• Hue labels (R, Y, G, C, B, M) appear at the rim with color-coded tick marks.
• Color targets — six small dots at the standard BT.601 chrominance positions for Red, Yellow, Green, Cyan, Blue, and Magenta.
• Degree markers every 30° around the rim.

What to look for

• Color casts: If the pixel cluster is offset from center, the image has a cast in that direction.
• Saturation range: A tight cluster near the center means muted colors; a spread toward the rim means vivid colors.
• Color distribution: See at a glance whether your image is warm (clustered toward Red/Yellow) or cool (toward Cyan/Blue).

The Display section at the top of the panel lets you choose how pixels are rendered on the scope. Two buttons toggle between modes:

The Harmony section lets you overlay color theory zones on the vectorscope. These zones help you evaluate whether your image’s colors align with a particular harmony scheme.

Schemes

Six buttons control the active scheme:

Rotation slider

Drag the Rotation slider (0–360°) to spin all zones together. This lets you experiment with different color pairings — for example, rotating a complementary overlay to see which hue pair best frames your subject.

Zone width slider

The Zone Width slider (0.1–3.0×) controls how wide each zone is. The base half-width is 15°. At 1.0× (default), zones are 30° wide. Increase the width for more tolerance; decrease it for tighter analysis.

How to use harmony overlays

1. Choose a scheme that matches your creative intent (e.g., Complementary for split-tone looks).
2. Rotate the overlay until the zones align with your image’s dominant color clusters.
3. Check how well your colors fall within the zones. Pixels outside the zones are “out of harmony.”
4. Use HSL or Color Balance adjustments to push out-of-zone colors into the nearest zone.

A dashed orange line extends from the center at 123° — the industry-standard angle for healthy skin tones in the BT.601 YCbCr color space. This line is always visible regardless of the harmony scheme.

How to use it: When grading portraits, check that your subject’s skin tones cluster near this line. If the skin tone cluster drifts away from the line, adjust the Hue or Tint controls to bring it back. Skin tones of all ethnicities should fall near this line when properly white-balanced — what varies is the distance from center (saturation), not the angle.

The vectorscope updates automatically whenever you make changes to your document:

• Brush strokes, fills, and paint operations
• Layer creation, deletion, and visibility changes
• Adjustment layer edits (Curves, Levels, Hue/Sat, etc.)
• Transform, crop, and resize operations
• Opening, closing, and switching between documents

Changes are debounced at 200ms, so rapid edits (like continuous brush painting) coalesce into a single refresh rather than overwhelming the panel.

The plugin samples your document at 256×256 pixels regardless of actual resolution. This keeps the refresh fast while preserving a representative color distribution.

Chromascope can send non-destructive edits back to Photoshop as adjustment layers. Corrections are applied via the batchPlay API and can always be undone or modified.

Supported adjustments

All edits create new adjustment layers — your original pixel data is never modified.