How do I pick a color from an image?

Upload an image and move your cursor over it; the HEX and RGB code of the pixel under the cursor is shown instantly. Click to select that color and copy it along with its HSL value.

What's the difference between HEX, RGB and HSL?

HEX is the common 6-digit color code for the web. RGB describes red-green-blue channels, while HSL expresses hue, saturation and lightness. All three describe the same color in different ways.

How do I get shades of my color?

The tool automatically shows lighter and darker shades derived from your selected color as a palette.

Color Picker

Upload an image and hover to read a color code from any pixel, or pick a color with the selector; see its HEX, RGB and HSL values, copy in one click, and explore matching shades.

HEX

#6366F1

RGB

rgb(99, 102, 241)

HSL

hsl(239, 84%, 67%)

CMYK

cmyk(59%, 58%, 0%, 5%)

#EFF0FE

#D0D1FB

#B1B3F8

#9294F5

#7375F2

#6366F1

#595CD9

#4547A9

#323379

#1E1F48

#0A0A18

Siyah MetinText on background

Beyaz MetinText on background

About

A color picker is the practical way to find the exact color code for your web design, graphic design and coding projects. Upload an image and move your cursor over it to grab the color of any pixel, then see the HEX, RGB and HSL equivalents at once and copy the format that fits your project.

The tool also generates lighter and darker shades derived from your selected color, making it easy to build a consistent color palette. For picking colors from an image, a screenshot or a logo, it's a fast, free solution for designers, developers and content creators.

How to use

To pick a color from an image, upload it and hover your cursor over it; or click the picker to choose a color, or enter a HEX code.
Click a pixel; the HEX, RGB and HSL values update automatically.
Use the copy button to grab any color code to your clipboard.

Frequently Asked Questions

How do I pick a color from an image?: Upload an image and move your cursor over it; the HEX and RGB code of the pixel under the cursor is shown instantly. Click to select that color and copy it along with its HSL value.
What's the difference between HEX, RGB and HSL?: HEX is the common 6-digit color code for the web. RGB describes red-green-blue channels, while HSL expresses hue, saturation and lightness. All three describe the same color in different ways.
How do I get shades of my color?: The tool automatically shows lighter and darker shades derived from your selected color as a palette.

Other tools

SVG to PNG Image Compressor Image Cropper Image Downloader Favicon Generator EXIF Viewer QR Scanner UTM Builder Voice Recorder Screen Recorder

Embed this tool

Copy the code below and paste it into your site's HTML to embed this tool for free. The snippet includes an attribution link back to the source.

<iframe src="https://tooldict.com/embed/en/color-picker" title="Color Picker" width="100%" height="600" style="border:1px solid #e2e8f0;border-radius:16px;max-width:680px" loading="lazy"></iframe>
<p style="font:13px/1.5 sans-serif">Powered by <a href="https://tooldict.com/en/color-picker" target="_blank" rel="noopener">Color Picker</a> — Tooldict</p>