A color picker from image lets you extract exact color values from any photo or graphic. Hover over the image to see a magnified loupe, then click to capture the hex, RGB, HSL, and CMYK values of any pixel.
Image
Drop or click to upload image
PNG, JPG, WebP, GIF
Hover for zoom loupe · Click to pick color
Last Picked Color
Color Palette (0/20)
Export Palette
How to Pick Colors from an Image
This color picker from image works entirely in your browser. Upload any image, hover over it to see a magnified loupe, and click to capture precise color values — without any server upload.
Step 1: Upload Your Image
Click the upload area or drag and drop any image. Photos, screenshots, design mockups, and brand assets all work. The image is loaded onto a canvas element in your browser.
Step 2: Use the Loupe to Zoom In
Hover your cursor over the image. A circular magnifying loupe follows your cursor, showing a 5× zoomed view of the pixels underneath. The crosshair at the center of the loupe shows the exact pixel that will be sampled. This helps you pick the right pixel on sharp edges or fine details.
Step 3: Click to Pick a Color
Click anywhere on the image to capture the color. The color info panel immediately shows all four formats: HEX, RGB, HSL, and CMYK. Click any Copy button to copy that specific format to your clipboard.
Step 4: Build Your Palette
Every color you click is added to the Color Palette below the info panel. You can save up to 20 colors. Click any swatch to copy its hex code. When you have all the colors you need, use Export to download as CSS custom properties or JSON.
Use Cases
Color pickers are useful for: extracting brand colors from a logo, matching a photo's color scheme in a design, identifying what specific color is used in a screenshot, or building a cohesive palette from a reference image for a web project.
FAQ
How do I pick a color from an image?
Upload an image, then hover your cursor over the canvas. A magnifying loupe shows a zoomed view of the pixels under your cursor. Click to capture the color at the center of the loupe. The hex, RGB, HSL, and CMYK values are shown in the color info panel.
What color formats does the picker show?
For each picked color, you see HEX (#RRGGBB), RGB (r, g, b), HSL (h, s%, l%), and approximate CMYK values. Click any Copy button to copy that specific format to your clipboard.
Can I export the colors I pick?
Yes. Use the Export Palette button to download your color palette as CSS custom properties (--color-1: #abc123;) or as a JSON file with all hex values.
Does this tool upload my images to a server?
No. The image is loaded directly into an HTML5 Canvas element in your browser. No data is sent to any server. Everything is processed locally.
How many colors can I save in the palette?
Up to 20 picked colors are stored in the palette. Once you reach 20, the oldest color is replaced. Use 'Clear Palette' to start fresh.
Is the color picker free?
Yes, completely free with no account required. Pick as many colors as you need and export in any format.