Image Color Picker

Finding the exact colour from an image

Guessing a colour by eye is surprisingly unreliable; two shades that look identical on screen can be noticeably different in code. Sampling the pixel directly gives you the precise value, which is what you need when matching a website to a logo, recreating a brand colour you do not have the code for, or pulling a palette out of a photograph you like.

HEX and RGB, and when to use each

HEX values such as #3B82F6 are the compact form used in CSS and most design tools, and they are what you will paste into a stylesheet or a design app most of the time. RGB values such as rgb(59, 130, 246) express the same colour as separate red, green and blue amounts, which is handy when you need to adjust one channel or work with transparency. Both describe exactly the same colour, so use whichever your tool expects.

Practical uses

• Matching a website's buttons and headings to a client's logo.
• Recreating a colour from a screenshot when you have no brand guide.
• Building a design palette from a photograph.
• Finding the exact background colour of an image to blend an element into it.

Picking a whole palette at once

If you want the overall colour story of an image rather than one specific pixel, the Color Palette Extractor analyses the whole picture and returns its dominant colours as ready-to-copy swatches. Both tools read the image in your browser, so nothing is uploaded.