PixelTools

Color palette extractor — colors from any image

Pull the dominant colors out of a photo, logo, or artwork. Click any swatch to copy its hex code, or export the whole palette as CSS variables or JSON.

🎨

Drop an image here or click to browse

Analyzed locally — never uploaded

Turn any image into a usable color palette

Designers, developers, and marketers constantly need colors pulled straight from a photo, logo, screenshot, or piece of artwork — to match a brand, build a theme, or find an accent that fits. This tool analyzes your image with median-cut quantization, the same family of algorithm used by professional design software, to find the most representative colors and rank them by how much of the image they cover.

  • 1. Drop in an image — it's analyzed locally and never uploaded.
  • 2. Choose how many colors you want (4 to 12).
  • 3. Click any swatch to copy its hex code, or export the whole palette as CSS custom properties or a JSON array.

Building a website with the result? You may also want to resize and compress the source image before publishing, and a matching favicon to complete the look.

Frequently asked questions

How are the colors extracted?

The image is analyzed with median-cut quantization — the same family of algorithm used by design tools — to find the most representative colors, sorted by how much of the image they cover.

Is my image uploaded?

No. The analysis runs entirely in your browser; your image never leaves your device.

Can I use the palette in my code?

Yes — export the palette as ready-to-paste CSS custom properties or a JSON array of hex values, or click any swatch to copy its hex code.

How this tool helps

Picking colors by eye from a reference image can be slow and inconsistent. Use this to start a brand palette, pull colors from a photograph, or inspect a design reference.

How to use it

  1. Add an image.
  2. Review the dominant colors and click a swatch to copy its hex value.
  3. Export the palette as CSS variables or JSON for your project.

Example

Extract five colors from a product photo and use the exported CSS variables in a landing page.

What you get

The result includes approximate dominant colors as hex codes, plus copy and export actions.

Good to know

Limitations: A dominant-color algorithm summarizes pixels; it does not understand brand meaning or accessibility contrast.

Privacy: Color extraction samples the image locally in your browser.