Image color palette extractor
How to use this tool
Upload a PNG, JPEG, WebP, or AVIF image to extract up to eight approximate dominant colors in your browser, with color values you can copy or download.
Extract beautiful, harmonious color palettes directly from any photograph or design asset. Powered by median-cut color quantization, it extracts primary, secondary, and accent tones with instant HEX and RGB color-code copying.
💡 3 Quick Steps to Get Started
Drop any image into the color palette analyzer.
Algorithmic pixel clustering reveals the key dominant and accent color swatches.
Click any color swatch to copy its hexadecimal or RGB code for Figma, CSS, or Canva.
When it helps
Use it to quickly assemble a color reference from a photo, illustration, or interface screenshot.
How it works
The tool samples the image at no more than 96 × 96 pixels, skips pixels with alpha below 128, quantizes RGB channels, and ranks buckets by frequency and colorfulness to keep up to eight colors.
Worked example
Upload an interior photo, copy the wall and furniture HEX values, or download the text file containing HEX, RGB, HSL, and CSS variables.
Limits and data handling
The image is downsampled and color channels are quantized. Pixels with alpha below 128 are skipped, so gradients, transparent areas, and small color regions can be merged or omitted. Images that cannot be decoded or exceed the limits produce no palette; EXIF and other image metadata are not palette output. There is no separate cancel button while a file is being read, and choosing another file ignores the old result.
The image and extracted values stay in your browser. Decoding, sampling, palette extraction, and text-file generation do not send them to the GoGo Tools backend.
Color Palette Extraction, K-Means Clustering & WCAG Contrast Guide
1. Color Quantization via K-Means Clustering
Extracting dominant color swatches projects millions of pixel vectors into a 3D Euclidean color space (RGB / CIELAB). The K-Means algorithm partitions color points into K discrete clusters, iteratively computing convergent cluster centroids to extract balanced dominant color palettes.
2. Color Model Standards: HEX, RGB, HSL & CIELAB Delta E
While RGB handles screen subpixel lighting, HSL provides intuitive perceptual tuning (Hue, Saturation, Lightness). CIELAB space accurately models non-linear human chromatic adaptation, allowing exact perceptual distance (Delta E) calculations.
3. W3C WCAG 2.1 Accessibility Contrast Ratios
Evaluating UI palettes against the Web Content Accessibility Guidelines (WCAG 2.1) ensures compliance: Level AA requires a minimum relative luminance contrast ratio of 4.5:1 for body text (3:1 for large text), while Level AAA targets 7:1.
Feedback
How can we improve this tool?
Send a suggestion or bug report for this tool.
FAQ
Image color palette extractor: Which images can I use?
Use PNG, JPEG, WebP, or AVIF images up to 20 MB and 32 million pixels. The palette count is fixed at up to eight colors and cannot be adjusted.
Image color palette extractor: Which color values are included?
The result shows up to eight approximate dominant colors with copyable HEX values. The downloaded text file also contains RGB, HSL, and CSS variables.
Image color palette extractor: Why can a color be missing?
The image is downsampled and color channels are quantized. Pixels with alpha below 128 are skipped, so gradients, transparent areas, and small color regions can be merged or omitted. Images that cannot be decoded or exceed the limits produce no palette; EXIF and other image metadata are not palette output. There is no separate cancel button while a file is being read, and choosing another file ignores the old result.
Image color palette extractor: Is the image or palette uploaded?
The image and extracted values stay in your browser. Decoding, sampling, palette extraction, and text-file generation do not send them to the GoGo Tools backend.
