# Color Picker from Image

> Upload an image and click any pixel to get its HEX, RGB, and HSL color. Works entirely in your browser — your image never leaves your device.

URL: https://uttir.com/image-color-picker
Categories: color-tools, image-tools, web-tools
Privacy: The image is decoded and drawn to a canvas in your browser. It never leaves your device.

## About

Pick exact colors from any image with one click. The eyedropper tool shows the pixel under your cursor, magnified, with HEX, RGB, and HSL values for the spot. Useful for matching brand colors in a screenshot, grabbing a palette from a photo, or pulling a specific shade from a design mockup.

Everything happens in your browser using the canvas API. The image is decoded locally and never uploaded to a server. You can drop in a photo, screenshot, or any standard image format (JPG, PNG, WebP, GIF).

## How to use

1. **Drop in an image** — Drop onto the upload zone or click to pick a file. JPG, PNG, WebP, GIF, and most browser-supported formats work.
2. **Click any pixel** — The magnifier zooms in so you can land on a single pixel.
3. **Read the color values** — HEX, RGB, and HSL values update in the panel as you click.
4. **Build a palette** — Click "Add to palette" to save each color. Export as JSON or CSS variables when you are done.

## FAQ

### Does the image get uploaded to a server?

No. The image is decoded with the browser's built-in FileReader API, drawn to a canvas in your browser, and never sent anywhere. You can verify this in DevTools → Network while using the tool.

### What image formats are supported?

Anything the browser can decode: JPG, PNG, WebP, GIF, BMP, and most modern formats. HEIC requires a special library; we recommend converting HEIC to JPG first with the HEIC to JPG tool.

### How accurate is the color?

Pixel-accurate, down to the byte. The displayed color is the exact sRGB value of the pixel you clicked. The magnifier zooms 10x so you can target a specific pixel without ambiguity.

### Can I export a palette?

Yes. The "Add to palette" button saves each picked color. When you have 2 or more, an export button appears with options for JSON, CSS variables, and copy-to-clipboard.

### What does the magnifier show?

The magnifier is a 10x zoom of the area around your cursor, with a crosshair on the exact pixel you are about to click. It updates as you move the mouse over the image.

## Related tools

- [Color Picker](https://uttir.com/color-picker) — Pick any color and copy it as HEX, RGB, or HSL.
- [Color Palette Generator](https://uttir.com/color-palette-generator) — Generate 5-color palettes from any base color using classic harmony schemes — analogous, complementary, triadic, and more.
- [HEX to RGB](https://uttir.com/hex-to-rgb) — Convert any HEX color code to its RGB and HSL equivalents.
- [RGB to HEX](https://uttir.com/rgb-to-hex) — Convert RGB values (0–255) into a HEX color code.

---

For the full HTML page with the live tool, visit https://uttir.com/image-color-picker.
This file is the markdown rendering at https://uttir.com/image-color-picker.md. See https://uttir.com/llms.txt for a site-wide summary.
