Image Color Picker

How to use

1. Upload image — Drop or pick a JPG, PNG, or WebP file
2. Click any pixel — Tap the colour you want — HEX, RGB, and HSL appear instantly
3. Copy the value — Click any code to copy to clipboard. The last 12 picks stay in your history

What Is an Image Colour Picker?

An image colour picker reads the exact RGB value of any pixel in a photo or screenshot and converts it to standard CSS colour formats. Designers use it to match brand colours from a logo or website screenshot; developers use it to grab swatches from mockups; anyone working on a slide deck can pull a colour straight from an inspiration image. This tool runs entirely in your browser — your image is never uploaded.

HEX, RGB, and HSL Explained

• HEX (#RRGGBB): The most common format on the web. Each pair of hex digits represents the red, green, and blue channel (0–255).
• RGB: Same channels, written as decimals. rgb(255, 0, 0) is pure red.
• HSL: Hue (0–360°), saturation (%), lightness (%). Easier for humans to reason about — to make a colour lighter, raise the lightness.

Tips for Accurate Picks

JPG compression slightly varies the colour of adjacent pixels. If you're sampling a flat-colour area like a logo, click a few nearby pixels and use the value that appears most often. For pixel-perfect work, use PNG screenshots — they preserve every colour exactly.

Privacy

The picker runs locally in your browser. No upload, no server processing, no tracking. Close the tab and nothing is retained.

Need to convert one colour to many formats? Use the Color Converter. Building a palette around your pick? Try the Color Palette Generator.

Frequently asked questions

Is the image uploaded?

No. The Canvas API reads pixel colours directly in your browser. Your file never leaves your device.

Does it work for transparent PNGs?

Yes. Transparent pixels return an alpha value of 0 and the RGB of whatever is behind the pixel in the source file.

What colour spaces are supported?

HEX (#RRGGBB), RGB (0–255), and HSL (hue, saturation, lightness). Copy any format with one click.

Why does the colour look slightly different in my image editor?

Browsers display sRGB. If your file uses a wide-gamut profile like Display P3 or Adobe RGB, the editor may show it differently. The picker returns the sRGB value the browser sees.

Can I pick from a website screenshot?

Yes — take a screenshot, upload it here, and click any pixel. Great for matching brand colours.

Related free tools

• Image & Screenshot Editor — Edit any image or screenshot with layered text (50 Google fonts), shapes, arrows, and pen. Every element remains editable.
• Image Compressor — Shrink JPG, PNG, and WebP images with adjustable quality. 100% private.
• Photo & Signature Resizer — Crop and resize a photo or signature to exact px/cm and a KB limit for online forms.
• Image Resizer — Resize images to any dimension with social media presets and aspect ratio lock.
• JPG to PNG Converter — Convert JPG images to lossless PNG in your browser. Supports transparency.
• PNG to JPG Converter — Convert PNG to JPG — typically 60–90% smaller files. Custom background colour.
• Image to WebP Converter — Convert JPG, PNG, or GIF to WebP. 25–50% smaller files for faster websites.
• Image Cropper — Crop JPG, PNG, or WebP images with drag-to-crop and aspect ratio lock. 100% private.
• Image Rotator & Flipper — Rotate any angle or flip horizontally/vertically. Fix sideways phone photos in seconds.
• EXIF Viewer — Read camera, lens, date, GPS and other metadata embedded in JPEG photos.
• Image Watermark — Add custom text watermarks with position, opacity, colour, and rotation controls.
• Image to PDF Converter — Combine multiple JPG or PNG images into a single PDF. Fit-to-image, A4, or Letter.