Practical guide

How to use Color Spectrum

Color Spectrum analyzes an image to surface dominant colors, related families, and individual pixel values. Designers and developers can use the result to build palettes, inspect references, and export reusable color data.

Step by step

  1. Choose an image from the device.
  2. Inspect extracted colors, families, and pixels in the interactive view.
  3. Copy or export the palette in the format needed by the next design or development task.

Example

InputA landscape image with blue sky and green vegetation
ResultA ranked palette with HEX, RGB, and related color-family information

How it works

The browser samples decoded image pixels, groups nearby colors, and ranks representative values. Results depend on sampling, image resolution, transparency, and the color space decoded by the browser.

Important limitations

  • Extracted colors are representative rather than a complete inventory of every pixel value.
  • Browser color management and image profiles can influence displayed values.

Frequently asked questions

Is my source image uploaded?

The analyzer processes the selected image in the browser and does not send it to a 77 Toolkit image service.

Why is a small accent color missing?

Dominant-color ranking favors colors that occupy more sampled pixels; inspect the image directly for small accents.