Color Picker
Upload an image and click any pixel to extract its color. Get HEX, RGB, HSL, and CMYK values instantly. Build a palette from your picks.
500+ colors picked
Drag & drop a file here, Ctrl+V to paste, oror
Pixel-Perfect Eyedropper
The zoom loupe follows your cursor at 8× magnification with a crosshair on the exact pixel, so you can pick the precise color you need.
4 Color Formats
Every pick gives you HEX, RGB, HSL, and CMYK values instantly. Copy any format to clipboard with one click for use in CSS, design tools, or print.
100% Private
Your image never leaves your device. Color extraction happens via the Canvas API in your browser. No server upload, no storage, no tracking.
How the eyedropper tool works
The image is drawn onto an HTML Canvas element, then getImageData reads the exact RGBA values of the pixel under your cursor. A magnifying loupe at 8× zoom follows your mouse, with a crosshair marking the precise pixel, so you can pick colors from tiny details or thin edges. On mobile, touch-and-drag works the same way — the color under your finger updates live. The tool extracts colors from any format your browser can render: JPEG, PNG, WebP, GIF, BMP, AVIF, and HEIC. For automatic dominant color extraction, try the Color Palette Extractor.
HEX, RGB, HSL, and CMYK explained
HEX is the most common web format — six hexadecimal digits representing red, green, and blue (#ff5733). RGB uses decimal values (0–255) for each channel and is the native format of screens and the Canvas API. HSL describes color as hue (0–360°), saturation (0–100%), and lightness (0–100%) — more intuitive for adjusting color properties. CMYK (cyan, magenta, yellow, key/black) is used in print workflows. This tool converts between all four automatically. To analyze the full tonal range of an image, check the Histogram Analyzer.
Building and using the color palette
Every click on the image adds the color to a palette strip (up to 24 swatches, deduplicated). Click any swatch to copy its HEX value to the clipboard; right-click to remove it. This is useful for sampling a brand's color scheme from a screenshot, extracting colors from a photo for a design project, or building a mood board palette. To apply color adjustments to the image itself, try the Image Filters tool. For adding colored text or shapes over an image, use the Image Annotator.
Use cases for image color picking
Designers use eyedropper tools to match colors from reference images, ensure brand consistency across assets, or identify the exact shade in a competitor's design. Developers copy HEX or RGB values directly into CSS. Print professionals need CMYK values for accurate color reproduction. Photographers pick colors from their shots to build harmonious editing presets. The Color Picker works with screenshots, photos, logos, illustrations — any image your browser can display. To check color accessibility, try the Contrast Checker. Explore all 88 image tools. Read our color picker guide for tips, examples, and best practices.