Tool2Help

Online Color Picker

Pick a color visually, refine it with precise sliders, and copy it in whichever notation your project needs.

Recent

Pick a color from an image

Drop an image here, or

The image is read locally and never uploaded.

About the color picker

A picker that gets out of the way. Drag on the saturation and lightness field to find a color by eye, then switch to the numeric sliders when you need to match an exact value from a brand guide. Recently picked colors are kept in a strip below so you can compare candidates side by side without losing your place, and every value in the readout copies to the clipboard on click.

How to use the color picker

  1. Drag inside the color field to choose a shade, or drag the hue slider to move around the color wheel.
  2. Use the RGB or HSL sliders when you need an exact numeric value.
  3. Click any value in the readout to copy it to your clipboard.
  4. Colors you pick are added to the recent strip so you can compare options.

Frequently asked questions

Can I pick a color from an image or from my screen?
Browsers that support the EyeDropper API, which currently means Chrome, Edge and Opera on desktop, will show a screen picker button. In other browsers you can still enter a HEX value copied from your image editor.
What is the difference between HSL and RGB sliders?
RGB adjusts the amount of red, green and blue light, which is how a screen physically works but is unintuitive to reason about. HSL separates hue, saturation and lightness, so you can make a color lighter without accidentally shifting it toward a different hue.
Are my recent colors saved between visits?
They are kept for the current browser session only. Nothing is written to a server, and closing the tab clears the list.

Other free tools people use alongside the Color Picker.

Color Converter Paste a color in any common format and get every other format back instantly, along with a live preview and a generated set of tints and shades. Color Contrast Checker Enter a text color and a background color to get the exact contrast ratio, plus a clear pass or fail against every WCAG 2.1 level. Color Gradient Generator Design a gradient visually and copy the CSS. Linear and radial, unlimited color stops, live full-width preview. Color Unit Converter Convert between units across eight categories, from centimetres and inches to gigabytes and gibibytes. Calculators