Color Converter & Picker

Convert colors between HEX, RGB, HSL, HSV, and CMYK instantly. Pick a color, sample any pixel with the eyedropper, adjust RGB and alpha, and copy CSS-ready values. Free and 100% client-side.

Built & Maintained by the devtoolspack Team

Last updated: August 2026

R
G
B
A
HEX#3b82f6
HEX8#3b82f6ff
RGBrgb(59, 130, 246)
RGBArgba(59, 130, 246, 1)
HSLhsl(217, 91%, 60%)
HSLAhsla(217, 91%, 60%, 1)
HSVhsv(217, 76%, 96%)
CMYKcmyk(76%, 47%, 0%, 4%)

Convert Any Color to Any Format

This color converter instantly translates a single color across every format front-end and design work needs: HEX, HEX8 (with alpha), RGB / RGBA, HSL / HSLA, HSV/HSB, and CMYK. Type a value, use the visual picker, or sample any pixel on your screen with the eyedropper — the results update live and each one copies with a single click.

HEX to RGB, RGB to HSL, and Back

The most common conversions — HEX to RGB, RGB to HEX, and RGB to HSL — are handled automatically. HSL and HSV are ideal for tweaking a color's lightness or saturation programmatically, while CMYK values help when a screen color needs to be matched for print.

Alpha & Named Colors

Full transparency support means you can work with rgba(), hsla(), and 8-digit HEX codes. You can also type any of the 147 standard CSS named colors — like tomato or rebeccapurple — and get their exact numeric equivalents. Everything runs locally in your browser; no colors are ever sent to a server.

Frequently Asked Questions

How do I convert HEX to RGB?

Paste your HEX value (e.g. #3B82F6) into the input box. The RGB equivalent — rgb(59, 130, 246) — appears instantly in the results, along with a copy button. Conversion happens live as you type.

What is the difference between HSL, HSV, and CMYK?

HSL (Hue, Saturation, Lightness) and HSV/HSB (Hue, Saturation, Value/Brightness) are intuitive models for picking and adjusting colors on screen. CMYK (Cyan, Magenta, Yellow, Black) is a subtractive model used for print. This tool shows all of them at once so you can copy whichever your project needs.

Does this support transparency / alpha?

Yes. Use the alpha slider or enter an rgba()/hsla() value or an 8-digit HEX (#RRGGBBAA). The tool outputs both opaque and alpha-aware formats so you can copy exactly what you need for CSS.

Can I pick a color from anywhere on my screen?

In supported browsers (Chrome, Edge), click the eyedropper button to sample any pixel on your screen — great for matching a color from an image or another app. The picked color is converted to every format automatically.

Can I use color names like "tomato" or "rebeccapurple"?

Yes. Type any of the 147 CSS named colors and the tool resolves it to HEX, RGB, HSL, HSV, and CMYK values you can copy.

Cite this Tool

Using this tool for a technical blog, research, or documentation? Copy a pre-formatted citation below to link back to devtoolspack.

APA Citation
devtoolspack. (2026). Color Converter & Picker. https://devtoolspack.dev/color-converter
MLA Citation
"Color Converter & Picker." devtoolspack, 2026, https://devtoolspack.dev/color-converter.