Image Color Picker
Upload an image, move over it to sample a pixel, and lock a color to copy HEX, RGB, or HSL values.
Your image is processed locally in your browser and is never uploaded to our server.
Loading tool…
How to use
- Add an image (brand screenshot, photo, or UI mock).
- Move over the image to sample a pixel; click or lock to hold a color.
- Copy HEX, RGB, or HSL into your design tokens or CSS.
Key benefits
Exact pixels
Sample the color that is actually in the file, not a compressed preview from another app.
Multiple formats
Copy HEX for CSS, RGB for design tools, or HSL when you adjust lightness.
Private
Pixels are read from a local canvas—no upload.
Tips for accurate samples
Zoomed browser UI can make aiming harder—sample from a large enough preview. For brand logos, a PNG with flat color areas works better than a heavily compressed JPG.
Need to isolate a product first? Try Remove Background, then sample the remaining colors.
FAQ
Common questions
Does sampling upload my image?
No. Pixels are read from a local canvas.
Why doesn’t the color match my design tool?
Color management, display profiles, and compression can shift appearance. This tool reports the pixel values decoded in the browser.
Can I pick from HEIC photos?
If the browser can decode the file (or after converting with HEIC tools), you can sample it like any other image.
Related tools
Image Info
Technical image inspector for dimensions, format, and memory estimates.
Open toolRemove Background
AI background removal in your browser — transparent PNG or WebP, no upload.
Open toolCrop Image
Crop with free or fixed aspect ratios, then export.
Open toolImage Compressor
Smart presets, target size, and batch optimization for JPG, PNG, WebP, and AVIF.
Open tool
Looking for more tools? Browse the tools directory.