tools / color pick

Color Picker

Pick any color, or upload an image and click on it to sample a color. Get HEX, RGB and HSL instantly — everything runs in your browser.

Options

Pick from an image

⬆️

Click to upload or drag & drop an image

Then click anywhere on it to sample that color

Output

HEX vs RGB vs HSL — what's the difference?

  • HEX (e.g. #4169E1) packs red, green, and blue into a 6-digit hexadecimal code. Compact and the most common format in CSS and design tools.
  • RGB (e.g. rgb(65, 105, 225)) expresses the same red/green/blue values as plain 0–255 numbers — easier to read and edit by hand than hex.
  • HSL (e.g. hsl(225, 73%, 57%)) describes color by Hue, Saturation, and Lightness instead — much more intuitive for tweaking a color ("make it lighter" = raise the L value) than RGB or hex.

How to pick a color from an image

Upload any image using the panel above, then click directly on the pixel whose color you want. The tool reads that exact pixel's RGB value and instantly converts it to HEX and HSL — useful for matching a brand color from a logo, or pulling a palette from a photo for a design.

Frequently asked questions

What's the difference between RGB and HEX color codes?

They represent the exact same color — HEX is just RGB values encoded in base-16 instead of base-10. rgb(65, 105, 225) and #4169E1 are identical colors, just written differently.

How do I find the exact color of a pixel in an image?

Upload the image in the tool above and click on the pixel you want — the color picker reads that pixel's value directly off the canvas and displays it in HEX, RGB, and HSL.

Are my uploaded images sent to a server?

No. The image is drawn to an HTML canvas entirely in your browser and never leaves your device.