Color Code Converter

Convert between HEX, RGB, HSL, HSV, and CMYK color formats instantly. Live preview, CSS variable output, and all formats simultaneously.

0uses

0/10(0)

HEX Color

Color Preview

#3b82f6

rgb(59, 130, 246)

All Color Formats

hexInput

#3b82f6

rgb

rgb(59, 130, 246)

hsl

hsl(217, 91%, 60%)

hsv

hsv(217, 76%, 96%)

cmyk

cmyk(76%, 47%, 0%, 4%)

CSS Custom Properties

--color-hex: #3b82f6;
--color-rgb: 59, 130, 246;
--color-hsl: 217, 91%, 60%;

Detailed Values

Property	Value
Red	59 (23.1%)
Green	130 (51.0%)
Blue	246 (96.5%)
Hue	217 deg
Saturation (HSL)	91%
Lightness	60%
Value (HSV)	96%
Cyan	76%
Magenta	47%
Yellow	0%
Key (Black)	4%

How to Use the Color Code Converter

Select an input format (HEX, RGB, HSL, HSV, or CMYK).
Enter your color values.
All other color formats update instantly with a live preview.
Copy any format with one click or grab the CSS variables.

Color Formats Explained

HEX is the most common web format. RGB defines colors by red, green, and blue channels (0-255). HSL uses hue, saturation, and lightness which is more intuitive for designers. HSV (hue, saturation, value) is used in many color pickers. CMYK (cyan, magenta, yellow, black) is the standard for print design.

Features

Convert between 5 color formats simultaneously
Live color preview swatch
CSS custom property output
One-click copy of any format
100% client-side processing for full privacy

Disclaimer:This tool is provided “as is” for informational and educational purposes only. Results may not be 100% accurate. ToolBird makes no warranties, express or implied, regarding the accuracy, reliability, or completeness of any output generated by this tool. This tool does not constitute professional, legal, financial, medical, or tax advice. Always consult a qualified professional for important decisions. By using this tool, you agree that ToolBird and its operators shall not be held liable for any damages, losses, or consequences arising from the use of this tool or reliance on its results. All processing occurs in your browser — we do not store, transmit, or access your data. Use at your own risk.