Image color picker
Color picker from image: click any pixel of a photo, screenshot or logo to get its HEX, RGB and HSL values, plus a palette of the main colors. No upload.
How to get a color from an image
Drop a photo, screenshot or logo above, or tap the box to choose one. Click or tap any spot and the color of that exact pixel appears as HEX, RGB and HSL, each with a copy button. Drag to move the picker around, or press the arrow keys to move it one pixel at a time, ten with Shift held. A zoomed view next to the swatch shows the pixels around the picker, so you can hit a thin line or a single letter.
Palette of the main colors
Under the picker, the tool lists the image's dominant colors, with 5, 8 or 12 swatches and the share of the image each one covers. It groups similar shades with a median cut on a small copy of the image, so each swatch is the average of a group of similar pixels rather than one exact pixel. Click a swatch to load its codes, or copy the whole palette as a list of HEX values.
Which color values you get
Values are read as your browser shows the image, in sRGB, the color space of CSS and most design tools. If a photo carries a color profile, such as the Display P3 profile on iPhone photos, the browser converts it to sRGB first, so the HEX code matches how the image looks on a web page. JPEG compression adds small color noise, so neighboring pixels in a flat area can differ by a few values. Pick a spot in the middle of a color, or use the palette for an average.
Formats and privacy
JPG, PNG, WebP, GIF, BMP and AVIF open directly in the browser, and iPhone HEIC photos are decoded with a small engine that downloads the first time you use one. Images above about 16.7 megapixels are scaled down to fit browser memory limits. The image is drawn on a canvas inside this tab and is never uploaded.
Before you start
Input: JPG, JPEG, PNG, WEBP, GIF, BMP, AVIF, HEIC, and HEIF. Output: HEX, RGB and HSL. The settings appear before anything runs, so you can check them first. Your original file is never changed.
Pick the size and quality for where the image will end up. Resizing before strong compression usually keeps more visible detail. Keep an untouched original so you can export again later.
Keep the original until you have opened and checked the result. The work happens in this browser tab, so the size you can handle depends on your device's memory, your browser and the file itself.
How to use the image color picker
- Drop an image above, or tap the box to choose one.
- Click or tap the spot whose color you want. Use the arrow keys to fine-tune.
- Copy the HEX, RGB or HSL value, or copy the palette of main colors.
Last updated · How we build and check tools · Report an error