Color Picker & Eyedropper

Upload an image to pick colors and get their HEX, RGB, and HSL codes.

Tools
Color Picker & Eyedropper
Add to Favorites Remove from Favorites Share on Facebook Share on X

Browse your files or drag and drop an image here.

Current Color

HEX #FFFFFF
RGB rgb(255, 255, 255)
HSL hsl(0, 0%, 100%)

Picked Colors (Click to save)

Sample Clear

About the Color Picker & Eyedropper Tool

We built this online Color Picker so you can grab any color from an image with precision. This tool is perfect for when you find an inspiring photo and want to use its colors in your own project. Just upload an image, and our eyedropper will let you select any pixel to instantly see its color code in HEX, RGB, and HSL formats. It's a must-have for web designers, developers, and artists.

How to Use the Tool

  • First, just drag and drop a photo into the upload area, click to browse your files, or simply paste an image from your clipboard (Ctrl+V or Cmd+V).
  • Once the image appears, move your mouse over it. A magnifying loupe will appear, showing you a zoomed-in view for precise selection.
  • The "Current Color" panel will update in real-time, showing you the exact color under your cursor.
  • To save a color, just click on the image. It will be added to your "Picked Colors" history.
  • You can copy any color code (HEX, RGB, or HSL) by clicking on it. You can also click a swatch in your history to make it the current color again.

Frequently Asked Questions

What is an eyedropper tool for?

An eyedropper tool lets you select, or "pick," a single color from an image. It's a standard feature in design software like Photoshop, and we wanted to bring that same powerful functionality to the web. It's used to sample colors so you can replicate them perfectly in your own designs, websites, or digital art.

Is my image uploaded to your server?

No, your privacy is our priority. The entire process happens in your web browser. We use an HTML canvas to analyze the image locally on your computer. Your files are never sent to or stored on our servers.

What color formats can I get?

Our tool provides the three most common color formats used in web design and development:

  • HEX: A six-digit code used in CSS, HTML, and design software (e.g., #FFFFFF).
  • RGB: Represents the Red, Green, and Blue values of a color (e.g., rgb(255, 255, 255)).
  • HSL: Stands for Hue, Saturation, and Lightness, which can be an intuitive way to adjust colors (e.g., hsl(0, 0%, 100%)).
You can copy any of these values with a single click.

How does the magnifying loupe work?

The loupe reads a small square of pixels from the image around your cursor and redraws them at a much larger size. We've set it to render with a "pixelated" look so you can see the individual pixels clearly, which helps you select the exact color you want with perfect accuracy.

Why can't I pick colors from images on other websites?

For security reasons, web browsers prevent scripts on one website from reading the content of another. This is called the "same-origin policy." To pick a color from a web image, you'll need to save it to your computer first and then upload it to our tool.

Tools