Color Picker From Image

Upload any image, hover with a magnifier to grab exact HEX, RGB, HSL, HSB, OKLCH, and CMYK values, and auto-extract a full palette. Free, no signup.

Written By Andrei Terteci

Last updated 7 days ago

The Color Picker From Image is at krumzi.com/tools/color-picker-from-image. Drop in a photo, logo, or screenshot and pull out the exact colors, in whatever format your workflow needs. It runs entirely in your browser: nothing is uploaded, and there's no account.

Getting an image in

You can drag and drop or browse for a file (PNG, JPG, GIF, WebP, SVG, or BMP, up to 20 MB), click Paste image to use whatever's on your clipboard, or paste an image URL. If a URL fails to load it's usually because that site blocks cross-origin access. Download the file and upload it directly instead.

Picking a color

Move your cursor over the image and a magnifier zooms in on the pixels under it, so you can land on exactly the pixel you mean instead of a blurry neighbour. The color panel on the left updates live as you hover. Click to lock a color in. Its HEX code is copied to your clipboard automatically and you get a small "Copied" toast.

The picked color is shown in six formats: HEX, RGB, HSL, HSB, OKLCH, and CMYK. Copy any one of them from its row.

Automatic palette

As soon as an image loads, the tool extracts its dominant palette (up to eight swatches) and shows it under the picker. Click any swatch to make it the active color and copy it. Under the swatches, Export palette lets you copy the whole set as CSS variables, a Tailwind config snippet, SCSS variables, or JSON, ready to paste into a project.

History

Every color you click is added to a history strip (the most recent 20), so you can go back to an earlier pick without hunting for the pixel again. Clear it whenever you like. Use Use a different image to start over with a new file.

What people use it for

  • Pulling the exact brand color out of a client's logo when nobody has the hex code.

  • Building a palette from a mood-board photo before designing a post.

  • Grabbing OKLCH or HSL values for a design system instead of converting by hand.

  • Getting CMYK for print from an on-screen reference.

Bring the colors into Krumzi

Once you have your hex codes, paste them into your Brand Kit or Brand Mind in the Krumzi app and every AI-generated design will use them automatically.