Drop any image to extract its dominant color palette. Get HEX, RGB and HSL codes. Click anywhere on the image to pick an exact pixel color. Nothing leaves your device.
Instant
Color Extraction
HEX
RGB + HSL
Free
No Uploads
100%
Privacy
Drop any image to extract its colors
JPEG, PNG, WebP, AVIF, GIF, SVG. Your image never leaves this device.
Brand designers
Extract a brand's exact colors from a logo or product photo. Get clean HEX codes to drop into Figma, Sketch or CSS.
Web developers
Copy CSS custom properties directly. Match a client's brand colors without guessing or sampling from screenshots.
Social media creators
Build a consistent color palette for feed posts and stories by extracting colors from your key brand image.
Interior designers
Extract colors from a mood board photo, fabric swatch or paint sample to build a cohesive room palette.
Photographers
Analyse the color mood of a shot. See the dominant tones to guide editing or to match across a series.
Print designers
Identify exact RGB values from a reference image before converting to CMYK for print production.
There's a specific kind of frustration that designers and developers know well. A client sends over a logo file, you zoom into it, try to eyedrop a color, and end up with three slightly different HEX codes depending on where you click and which tool you're using. Or you're building a website and trying to match the brand colors from a JPEG reference image, and every attempt feels slightly off. The image color picker exists to solve that exact problem.
Drop any image and the tool reads the actual pixel data from your file. Not a screenshot of it, not a compressed re-rendering. The raw pixel values. That's why the HEX codes you get here match what you'd see if you opened the same file in Photoshop or Figma and sampled from it directly.
A typical photograph contains hundreds of thousands of distinct colors. Showing all of them would be useless. What you actually want is a small set of the colors that define the visual character of the image. The tool uses a median-cut quantization algorithm to find them. Think of it like sorting a pile of thousands of colored marbles into groups by shade, then picking the most representative marble from each group. The result is a palette that genuinely reflects what the image looks like, not just what's most common by raw pixel count.
You can extract between 3 and 12 colors depending on what you need. For a brand logo or a product with a clean background, three to five colors is usually the right call. For a landscape photo or a complex illustration where you're trying to understand the full tonal range, eight to twelve gives you a more complete picture.
These are two different things and they're useful in different situations. Palette extraction tells you what the dominant colors are across the whole image. Pixel picking tells you the exact color value at a specific point. If you're matching a button color to a logo, you want pixel picking. Click directly on the part of the logo you're matching and you'll get the exact HEX code for that point. If you're building a color scheme inspired by a photo, palette extraction is what you want.
Once you've got the palette you want, the CSS export button outputs the colors as custom properties that you can paste directly into your stylesheet. Something like --color-primary: #2D4A8C; ready to drop in and use. This saves the copy-paste-reformat cycle that eats up time when you're manually transferring colors from a design tool into code. If you need the palette as a visual reference rather than code, the PNG download gives you a swatch image you can drop into a Figma file, a mood board, or a client presentation.
The tool uses a median-cut quantization algorithm, the same technique used by professional tools like Color Thief. It reads the pixel data from your image directly in the browser, groups similar colors together, and returns the most dominant distinct colors. Everything runs locally — your image is never sent to a server.
Each extracted color shows HEX (for CSS and web), RGB (red, green, blue values), and HSL (hue, saturation, lightness). You can click any value to copy it to your clipboard instantly.
Yes. After uploading an image, you can tap or click anywhere on it to read the exact pixel color at that point. The color is shown with HEX, RGB and HSL values and can be copied to your clipboard.
You can extract between 3 and 12 dominant colors. Use the palette size control to choose how many colors you want. Smaller palettes work well for branding and logos. Larger palettes are better for complex photographs.
Yes. You can copy the full palette as CSS custom properties (variables) with one click, or download the palette as a PNG swatch image to use in design tools.
No. Your image never leaves your device. All color extraction happens entirely in your browser. You can verify this by disconnecting from the internet — the tool still works perfectly.
Color Palette Generator
Automatically extract the dominant color palette from an entire image.
Resize Image
Resize to any pixel dimensions. Fill, fit or stretch.
Compress Under 100KB
Reduce file size for portals and upload forms.
JPG to WebP
Convert JPEG to WebP for smaller web images.
Resize for Instagram
All Instagram formats. Upload once, download all sizes.
