Can I extract a color from an image?

Currently only picking a color directly from the color selector (palette) is supported.

It's a way of expressing color as Hue, Saturation, and Lightness — useful when you want to keep the hue while adjusting brightness or saturation.

Is the color I pick sent to a server?

No. It's converted entirely in your browser.

This tool shows opaque colors. Append alpha to the RGB value — rgba(r,g,b,a) or 8-digit HEX #RRGGBBAA .

They are identical — 3-digit HEX doubles each digit, so #f00 = #ff0000.

Pick a color to instantly see its HEX, RGB, and HSL codes.

HEX

RGB

HSL

Input

HEX #2554e0

Output

rgb(37, 84, 224)
hsl(225, 75%, 51%)

Picking the HEX code #2554e0 instantly converts the same color into its RGB (37, 84, 224) and HSL (225°, 75%, 51%) notations.

HEX, RGB and HSL describe the same color in different ways — all interchangeable in CSS.

Notation	Format	Notes
HEX	`#RRGGBB`	Three hex pairs — the most common in CSS
RGB	`rgb(37, 84, 224)`	Each channel 0–255 — additive display mixing
HSL	`hsl(225, 75%, 51%)`	Hue wheel (0–360°) — easiest for adjusting saturation/lightness
Alpha variants	`rgba() / #RRGGBBAA`	Append an alpha channel when you need transparency

Can I extract a color from an image?: Currently only picking a color directly from the color selector (palette) is supported.
What does HSL mean?: It's a way of expressing color as Hue, Saturation, and Lightness — useful when you want to keep the hue while adjusting brightness or saturation.
Is the color I pick sent to a server?: No. It's converted entirely in your browser.
Can I make a transparent color?: This tool shows opaque colors. Append alpha to the RGB value — rgba(r,g,b,a) or 8-digit HEX #RRGGBBAA.
Are #f00 and #ff0000 different?: They are identical — 3-digit HEX doubles each digit, so #f00 = #ff0000.