Upload an image, then click any point to identify the exact pixel colour. Get HEX, RGB and HSL values instantly without uploading the image to a server.
This tool works like a simple browser-based eyedropper. Upload a photograph, screenshot, logo or illustration and click the precise area you want to sample. The selected pixel is converted into HEX, RGB and HSL values that you can copy into CSS, design software or a brand document.
Unlike the Image Palette Generator, which automatically finds five dominant colours, this page is designed for precision. Use it when you already know which part of an image contains the colour you need.
Because images can contain anti-aliasing, shadows, compression and lighting variations, nearby pixels may have slightly different values. If you are trying to identify a flat brand colour, click a solid area away from edges and shadows.
HEX is a six-digit representation commonly used in CSS and web design. RGB describes the red, green and blue channel values from 0 to 255. HSL expresses the same colour as hue, saturation and lightness, which can be easier when you want to make systematic adjustments.
Once you have identified a colour, you can use it as the starting point for the Brand Colour Palette Generator, create related combinations with the main Colour Scheme Generator, or check whether it works for readable text in the Contrast Checker.
No. The browser reads the image locally using the Canvas API. The image does not need to be sent to our server for the picker to work.
Photographs and compressed images contain many small colour variations. Even an area that looks visually flat can contain different pixels because of lighting, texture, anti-aliasing or compression.
This tool samples the exact point you click. The Image Palette Generator analyses the whole image and automatically returns five dominant colours.
Yes. Copy the HEX value and use it anywhere CSS accepts a colour, such as color, background-color, borders or gradients.