Image Color Picker
Privacy-first color picker: extract exact pixel colors and auto-generate palettes from any image with K-means, median cut, or frequency algorithms. Includes WCAG contrast and color blindness simulation.
Zero upload. Pixels never leave your device.
Drop an image here, paste, or click to upload
Max 10 MB. PNG, JPG, WebP, GIF.
Click the image or use the auto palette to start collecting colors.
Saved palette is empty.
No recent images yet.
Privacy by default
Every pixel stays on your device. We use the Canvas API for decoding and the algorithms run entirely in your browser — no upload, no network request carries pixel data.
Three ways to pick colors from an image
Eyedropper mode reads a single pixel under the cursor with an 8× lens magnifier. Palette mode runs a clustering algorithm over the whole image. Region mode lets you drag a rectangle and runs the algorithm inside the box only — useful when a logo or focal subject sits in one corner.
Why algorithm choice matters
Frequency builds a histogram in a 5-bit-per-channel cube — instant, but biased toward large flat backgrounds. Median cut splits pixel buckets along the widest channel axis — balanced for posters and illustrations. K-means clusters in CIE L*a*b* space where Euclidean distance roughly matches perceived color difference — slower but the most accurate for photos.
WCAG and color blindness, explained
Shift-click any two saved colors to view the WCAG 2.1 contrast ratio plus pass/fail badges for AA / AA Large / AAA / AAA Large. Toggle Protanopia, Deuteranopia, or Tritanopia to preview how your palette appears under common types of color vision deficiency — the simulation uses SVG feColorMatrix filters in real time.
Frequently asked questions
- Is my image uploaded anywhere?
- No. The image is decoded by Canvas inside your browser; no network request carries pixel data.
- Why does K-means use Lab color space?
- Lab is perceptually uniform — equal Euclidean distance corresponds to roughly equal perceived color difference. RGB clustering tends to overweight green channel and underweight chroma.
- Which algorithm should I pick?
- K-means for highest accuracy, median cut for balanced speed/quality, frequency for instant feedback on large images.
- Why does the palette change every time with K-means?
- K-means++ uses random initialization. Results converge to similar colors but the exact HEX values can drift by a few units per channel. Re-run to get a different seed.
- What does WCAG ratio 4.5:1 mean?
- It is the minimum contrast required for normal-size body text to be readable per WCAG 2.1 AA. 7:1 is required for AAA.
- How does color blindness simulation work?
- We apply an LMS cone-response matrix via an SVG feColorMatrix filter — the same approach used by Chromium DevTools. The simulation is approximate and not a substitute for testing with real users.
- Can I drop a logo with a transparent background?
- Yes. Fully transparent pixels are excluded from the palette algorithm.
- Why is the EyeDropper button disabled?
- The native EyeDropper API is only available in Chromium browsers (Chrome 95+, Edge 95+). In Firefox/Safari we fall back to in-canvas picking — hover and click on the image to read pixels.
Related Tools
Color Converter
Convert colors between HEX, RGB, HSL, HWB, OKLCH instantly. WCAG contrast checker and OKLCH-based shade scale included. Runs entirely in your browser.
EXIF Viewer
Inspect EXIF metadata or strip it from JPEG and PNG images entirely in your browser. Pixel-perfect rewrite, GPS revealed only on demand, zero uploads.
Image Compressor
Compress JPEG, PNG, WebP, and AVIF images locally. Batch processing, target size mode, automatic EXIF stripping. Files never leave your browser.