Converter Web ToolsConverter WebTools

Image Color Picker

Upload, drag, or paste an image and pick any color from it — get HEX, RGB, HSL, HSV and CMYK instantly, with a zoom magnifier for pixel-perfect picking. Your image never leaves your browser.

About the Image Color Picker

The Image Color Picker lets you grab the exact color of any pixel in a photo, logo or screenshot. Add an image, hover to zoom in with the magnifier loupe, and click to capture the color in five formats — HEX, RGB, HSL, HSV and CMYK — ready to copy into your design or code. It also extracts the image's dominant-color palette and lets you build a gradient and run a WCAG contrast check right on the page. Everything is processed locally in your browser with an HTML canvas and is never uploaded to a server.

Private by design: your image is read with a canvas in your own browser — it is never uploaded. Pick colors, extract a palette, make a gradient and check contrast without anything leaving your device.

How Image Color works

Every pixel in an image is made of red, green and blue light. When you pick a pixel, this tool reads those values and converts them into the formats designers and developers use most:

  • HEX — a 6-digit code such as #3b5bfd, used in CSS and HTML.
  • RGB — red, green and blue from 0–255, e.g. rgb(59, 91, 253).
  • HSL — hue, saturation and lightness; easy to tweak by hand.
  • HSV — hue, saturation and value (brightness); common in design apps.
  • CMYK — cyan, magenta, yellow and black, used for print.

The image is drawn onto an HTML canvas and read locally with getImageData, so picking is instant and your file never leaves your browser.

How to use

  1. Upload an image, drag & drop it, or paste a screenshot with Ctrl+V.
  2. Move your cursor over the image — the zoom magnifier shows the exact pixel under the crosshair.
  3. Click (or tap and lift on touch) to capture the color, then copy HEX, RGB, HSL, HSV or CMYK.
  4. Use the auto-extracted palette, build a gradient, or run a WCAG contrast check — all on this page.

Common uses

  • Matching a color from a photo or screenshot.
  • Extracting brand colors from a logo.
  • Building palettes from inspiration images.
  • Finding the exact color of a UI element.
  • Getting print-ready CMYK values from an image.
  • Checking text/background contrast for accessibility.

Frequently asked questions

How do I pick a color from an image?
Add an image (upload, drag-and-drop, or paste a screenshot with Ctrl+V), move your cursor over it, and click the spot you want. The tool instantly shows that pixel's HEX, RGB, HSL, HSV and CMYK codes, each with a one-click copy button.
How do I get the exact HEX color of a pixel?
Use the zoom magnifier — the loupe that follows your cursor — to land on the exact pixel, then click. The highlighted centre pixel of the loupe is the one captured, so you get the precise HEX even on small details or anti-aliased edges.
What color formats does it support?
HEX, RGB, HSL, HSV and CMYK — covering web design, UI work and print.
Can I paste a screenshot instead of uploading?
Yes. Copy a screenshot (Print Screen) and press Ctrl+V on this page; it loads instantly, with no upload.
Which image formats can I use?
Any image your browser can display, including PNG, JPG, JPEG, GIF and WebP.
Is my image uploaded anywhere?
No. The image is processed entirely in your browser with a canvas and never leaves your device, so it stays completely private.
Can it build a palette or check contrast?
Yes. The dominant colors are extracted automatically into a copyable palette, and you can build a CSS gradient and run a WCAG AA/AAA contrast check from your picked color, all on this page.
Is the Image Color Picker free?
Yes — it is completely free, with no sign-up and no installation required.