Aqeeb Studio

Images

Image Color Extractor

Choose an image to see its dominant colors as swatches with HEX and RGB values. Your image is processed locally in your browser and is not uploaded.

Private: Your image is processed locally in your browser and is not uploaded.

Choose an image to see its dominant colors here.

Your colors and images stay in your browser. Nothing is uploaded or stored on our servers.

How to use the Image Color Extractor

  1. Choose an image, or drag and drop one onto the tool. JPG, PNG, WebP, GIF and other browser-supported formats work, up to 25 MB.
  2. Set how many colors you want, from 3 to 12.
  3. Read the swatches: each shows its HEX code, RGB value and the share of the image it covers.
  4. Click or tap the image to read the exact color of any pixel, then copy a value or export the palette as CSS, JSON, SVG or PNG.

Examples

Colors from a logo

Drop in a logo and extract two or three colors to get the brand's main HEX codes, then check them in the contrast checker.

A photo palette

A sunset photo might return a deep blue, a warm orange and a soft pink, each with the percentage of the image it covers.

An exact pixel

Click the image to read one pixel's color when you need the exact value rather than the average of a group of similar pixels.

Tips

  • Use a few colors (3 to 6) for a palette and more (8 to 12) when you need detail.
  • Photos with large flat areas, such as sky or walls, produce more distinct palettes.

Questions about the Image Color Extractor

Is my image uploaded?

No. Your image is processed locally in your browser and is not uploaded. It is read with the Canvas API, analyzed on your device and discarded when you close the page.

How does the extractor choose the colors?

It shrinks a copy of the image, groups similar pixels with k-means clustering and reports the center of each group, ordered by how much of the image it covers. The method is deterministic, so the same image gives the same palette.

Which image types work?

JPG, PNG, WebP, GIF and any other format your browser can display, up to 25 MB. Very large images are scaled down for analysis.

Why do the percentages not add up to exactly 100%?

Each one is rounded to a whole number, and colors that cover less than 1% are shown as under 1%.

Why does a swatch look slightly different from the image?

Each swatch is the average of many similar pixels, so it is representative rather than an exact pixel. Click the image to read an exact pixel.

Color Palette Generator

Generate harmonious palettes and export them as CSS, JSON, SVG or PNG.

Color Picker

Pick any color and copy its HEX, RGB, HSL and CMYK values.

Color Blindness Simulator

Preview colors and images as people with color vision deficiency may see them.

Color Converter

Convert between HEX, RGB, HSL, HSV, HWB and CMYK instantly.