Drop any image and click anywhere on it to read the exact color at that pixel. The tool returns hex, RGB, and HSL values, keeps a history of your recent picks, and lets you copy any value with one tap. All processing runs in your browser using the Canvas API.
How it works
The tool draws your image to a hidden HTML canvas at its natural resolution. When you click a pixel, the Canvas API call ctx.getImageData(x, y, 1, 1).data returns the exact RGBA bytes. Those bytes are formatted as hex, RGB, and HSL, and the color is added to a small history strip of recent picks.
Processing runs in your browser
All color sampling happens locally in your browser tab using the Canvas API. Our servers are not involved at any point.
Frequently asked questions
- Is my image uploaded to a server?
- All color sampling runs in your browser using the Canvas API. Our servers are not involved at any point.
- How accurate is the color reading?
- Pixel-perfect. The tool draws the image at its natural resolution to a hidden canvas and reads the RGBA bytes directly with getImageData, so the values match the source file exactly.
- Why are hex, RGB, and HSL all shown?
- Hex is convenient for CSS and design tokens, RGB matches what most image editors display, and HSL is useful when you want to tweak hue, saturation, or lightness without rewriting the whole color.
- Does it work on mobile?
- Yes. Touch and drag across the image to see live color updates, with a magnifier showing the exact pixel you are sampling. Each swatch in the history has a tap-friendly copy button.
- Can I sample colors from screenshots?
- Yes. Drop a screenshot of any UI, photo, or design file into the picker and click to read brand colors, accent shades, or background tones.