Pick Colors and Color Codes From Any Image
The image color picker turns any photo, screenshot, logo or artwork into color
codes you can actually use. Upload an image and the tool reads every pixel in your browser, finds
the colors the image is really made of, and gives you the HEX code for each one.
Need one specific color instead? Use the eyedropper and the built-in magnifier to land on the
exact pixel you want – down to a single pixel, even on a phone.
Nothing is uploaded. The picture is read with the browser file API and drawn onto an HTML5 canvas
on your own device, so client logos, unreleased artwork and personal photos never leave your
computer.
How to get the color code from an image
-
Add your image. Click the upload area or drag a file straight onto it.
Any format your browser can show works – JPG, PNG, WebP, GIF, BMP or AVIF.
-
Check the extracted palette. The picker analyses the image and returns its
dominant colors. Move the slider to ask for anywhere between 1 and 9 colors.
-
Locate a color. Click any swatch and a marker jumps to the place in the photo
that color came from, so you can see exactly what you picked up.
-
Fine tune or add colors. Drag the marker to re-pick a swatch, or click the
eyedropper tile and click anywhere on the image to add a new color. The loupe magnifies the
pixels under your cursor and shows the live hex value.
-
Use the colors. Click a hex code to copy it, or send the whole set to the
color palette editor to name the colors, build a scheme and
preview them on mockups.
Dominant color extraction, not just averages
A lot of tools return the average color of an image, which is usually a muddy brown. This picker
buckets the pixels into a color histogram and then chooses colors that are both
popular in the image and far apart from each other in color
space. The result is a palette of the image's real, distinct colors instead of six versions of the
same shade – the sky, the jacket and the highlight all make it in, ordered from most
dominant to least.
What you can use it for
-
Brand and logo colors. Grab the exact hex code from a logo, screenshot or
style guide image when you don't have the source file.
-
Moodboards and design palettes. Turn an inspiration photo into a working
color palette for a website, deck or poster.
-
Interior and paint projects. Photograph a wall, sofa or fabric and match it
against real paint color families.
-
Photo editing and grading. Sample skin tones, skies or shadows to build
consistent looks across a series of images.
-
Accessibility work. Pull the foreground and background colors out of a design
screenshot and check them for contrast.
From picked colors to a full color palette
Picking colors is only the first step. Open in Palette Editor hands your colors to
the Colorxs palette generator, which matches every color to the
closest named color, Pantone, RAL or paint brand shade, lets you build
harmonies around it – monochromatic, analogous, complementary, triadic – and shows the
palette applied to website, app and product mockups. You also get a permalink you can share with
your team.
Frequently asked questions
How do I find the color code of an image?
Upload the image above, click the eyedropper tile, then click the pixel you want. The magnifier
shows which pixel you are on and its hex code, and that color is added to your palette ready to
copy.
Are my images uploaded to a server?
No. The image is read by your browser and drawn on a canvas on your own device. Nothing is sent to
colorxs.com and nothing is stored, so private photos stay private.
How many colors can I extract from a photo?
Up to 9 dominant colors are extracted automatically. You can add more by hand with the eyedropper,
for a palette of up to 12 colors, and delete any color you don't want.
Which image formats are supported?
Any format your browser can display – JPG, PNG, WebP, GIF, BMP and AVIF all work, including
screenshots and images with transparency (fully transparent pixels are ignored).
Does it work on a phone or tablet?
Yes. The picker uses pointer events, so tap and drag on a touch screen behaves exactly like a
mouse, and the magnifier follows your finger so you can still hit a single pixel.
More color tools