Image Color Picker

Pick any color from a photo and get HEX, RGB, HSL, HSV, CMYK, LAB and OKLCH. Pixel loupe, WCAG contrast checker and nearest Tailwind class. Free, no upload.

Loading the tool…

Free Image Color Picker for Photos & Web Design

Pick the exact color of any pixel in a photo, screenshot, logo or mockup and get it in every format you actually need — HEX and RGB for CSS, HSL and HSV for adjusting, CMYK for print, and LAB and OKLCH for color-accurate work. The whole tool runs in your browser on an HTML canvas, so your image is never uploaded to a server.

For photo work

  • Pixel loupe — a magnified, unsmoothed view follows your cursor so you can land on the exact pixel.
  • Sample averaging — read a single pixel or average a 3×3, 5×5 or 11×11 block, the same options Photoshop's eyedropper offers. Averaging is the right choice on noisy or grainy photos, where one pixel is not representative.
  • Zoom up to 6× with pixel-sharp rendering for small details and icons.
  • Alpha readout for transparent PNGs.

For web design

  • WCAG contrast checking — instant ratios against white, black and any color you choose, with AA / AAA / Fail verdicts, so you know a color is legible before you ship it.
  • Nearest Tailwind class — matched in OKLab, so “closest” means closest to the eye rather than closest in raw RGB numbers.
  • Tint and shade ramp — an 11-step scale built around your color and blended in OKLab for even steps.
  • Color harmonies — complementary, analogous, triadic, split-complementary, tetradic and monochromatic.
  • Export your saved swatches as CSS custom properties, or copy every hex at once.

How to Use

  1. Upload an image, drag one in, or paste a direct image URL.
  2. Move your cursor over the image — the loupe magnifies it and the values update live.
  3. Pick a sample size. Use 1×1 for flat graphics and logos, and 3×3 or larger for photographs.
  4. Click to lock a color. It is saved to your swatches, and the contrast, ramp and harmony panels all update.
  5. Copy any format with one click, or export all your swatches as CSS.

Supported File Types

Image: PNG, JPG/JPEG, WebP, GIF, BMP, AVIF and SVG — any format your browser can decode.

Privacy and Security

We respect your privacy. This tool is a browser-based application, which means your files are processed directly on your device. No image is ever uploaded to our servers, and nothing is stored after you close the page.

Guides

All how-to guides →

All image tools →