Extract dominant colors from an uploaded image by sampling pixels, quantizing similar values, and ranking the most frequent swatches. Each result includes a CSS hex code and matching RGB tuple via the shared color helper.
Algorithm (simplified)
- Draw the image to a canvas at full resolution
- Walk pixels with a step stride (every 4th pixel by default) for performance
- Skip mostly transparent pixels (alpha below 128)
- Quantize channels to 32-step buckets to merge near-duplicates
- Sort buckets by frequency and return the top N colors
This is a frequency-based palette, not a perceptual clustering algorithm (no k-means). It works well for flat UI graphics and posters; noisy photos may return muddy mid-tones.
When to use it
- Bootstrap a color palette from a brand photo or logo raster
- Pair with the Colors tools (
from-hex-to-rgb) for further conversion - Document design tokens extracted from marketing screenshots
Limitations
Heavily compressed JPEGs and gradients produce averaged colors. Transparent PNG/WebP backgrounds are ignored where alpha is low. Very large images are sampled sparsely—extreme detail may be missed. Results are indicative, not a substitute for professional palette extraction tools.