Color Converter
Convert colors between HEX, RGB, HSL, HSV, and CMYK formats.
Click to pick
HSL
All formats
#3B82F6rgb(59, 130, 246)rgba(59, 130, 246, 1)hsl(217, 91%, 60%)hsv(217, 76%, 96%)cmyk(76%, 47%, 0%, 4%)Variations
Click a variation to select it
Web Colors (HEX/RGB)
Use for CSS, HTML, and web design. HEX is compact, RGB is more readable.
Print Colors (CMYK)
Use for print design. Note: RGB to CMYK is approximate — verify with print proofs.
Color format reference
| Format | Example | Use Case |
|---|---|---|
| HEX | #3B82F6 | CSS, HTML, web design |
| RGB | rgb(59, 130, 246) | CSS, JavaScript, screens |
| HSL | hsl(217, 91%, 60%) | CSS, color palettes |
| HSV | hsv(217, 76%, 96%) | Graphics software |
| CMYK | cmyk(76%, 47%, 0%, 4%) | Print design |
Frequently Asked Questions
What's the difference between HEX and RGB?
Both represent the same color space. HEX uses hexadecimal (e.g., #FF5733) while RGB uses decimal (e.g., rgb(255, 87, 51)). HEX is more compact, RGB is more readable.
When should I use HSL?
HSL (Hue, Saturation, Lightness) is intuitive for creating color variations. Keeping H constant while adjusting S and L creates harmonious color palettes.
Is RGB to CMYK conversion accurate?
RGB to CMYK conversion is approximate because they use different color models. RGB is additive (light), CMYK is subtractive (ink). Always verify with print proofs for professional printing.
What's the difference between HSL and HSV?
HSL and HSV both describe hue and saturation but differ in the third component. HSL uses Lightness (0% = black, 100% = white), HSV uses Value (0% = black, 100% = pure color).
Can I use CMYK values in CSS?
No, CSS doesn't support CMYK. Use HEX, RGB, or HSL for web. CMYK is only for print design software like InDesign or Illustrator.