Pick a color from any image online - get HEX, RGB, and OKLCH instantly

You spot a color in a photo - the exact blue in a brand's hero image, the warm off-white of a product background - and you need the HEX or RGB value to use it in CSS or a design tool. Here is the fastest way to get it without Photoshop or Figma.

Open Image color picker on toolit, upload or drop your image, and click anywhere on it. You get the HEX, RGB, and HSL values instantly. No signup, no installation, nothing sent to a server.

Common use cases

Matching a brand color from a screenshot Brand guidelines PDFs sometimes lack a digital color spec, but they always include the logo. Screenshot it, drop it into the color picker, and sample the exact shade to get the precise HEX value you need for your CSS or design file.

Picking from a product photo for CSS You are building a product page and want the background or accent color to echo the product's dominant shade. The image color picker makes this a one-click job instead of a Photoshop detour or a trip through eyedropper browser extensions.

Building a palette from a photo Sample several points across a photo to build a consistent color story. Click the warm highlight, the mid-tone, and the deep shadow to extract a three-color palette. Useful for landing pages, presentations, and visual identity work where you want to tie the design back to a real photograph.

Identifying a color from a competitor's website screenshot Take a screenshot, drop it into the tool, and sample the colors directly. Much faster than inspecting element in DevTools when you do not have access to the source code.

What is OKLCH and when do you need it?

OKLCH is a modern perceptual color space. If you are writing CSS for current browsers - Chrome, Firefox, and Safari all support it natively - OKLCH values give you more predictable results when you need to lighten, darken, or shift a color programmatically.

The OKLCH picker on toolit lets you explore a color's OKLCH coordinates and adjust lightness or chroma without the unexpected hue shifts you get with HSL. If you are building a full color system rather than picking a single value, it is worth the extra step.

Tip: for colors on live websites

If the color is already on a webpage rather than an image file, the browser's built-in DevTools color picker in the Styles panel is usually the fastest option. For photos, mockups, screenshots, and exported design files, the image color picker is the cleaner path.