Color Code Converter
Convert between HEX, RGB, HSL, HSV, and CMYK color formats instantly. Live preview, CSS variable output, and all formats simultaneously.
Color Preview
#3b82f6
rgb(59, 130, 246)
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
Recommended Products
AdAffiliate Disclosure: As an Amazon Associate, ToolBird earns from qualifying purchases. Links above are affiliate links — if you buy through them, we may earn a small commission at no extra cost to you.
Disclaimer: This tool is provided as-is for informational and educational purposes only.