Language
English English Vietnamese (Tiếng Việt) Vietnamese (Tiếng Việt) Chinese (简体中文) Chinese (简体中文) Portuguese (Brazil) (Português do Brasil) Portuguese (Brazil) (Português do Brasil) Spanish (Español) Spanish (Español) Indonesian (Bahasa Indonesia) Indonesian (Bahasa Indonesia)

RGB to HSL Converter

Convert RGB color values to HSL format. HSL is more intuitive for creating color variations.

The RGB to HSL Converter transforms RGB (Red, Green, Blue) values into HSL (Hue, Saturation, Lightness) format. HSL is more intuitive for creating color variations and adjustments.

  1. Enter your RGB values (e.g., 59, 130, 246)
  2. The HSL value will be calculated automatically
  3. Click the copy button to copy the result
  4. View all color formats in the panel below
  • Real-time conversion as you type
  • Flexible input format (comma or space separated)
  • Color preview for visual verification
  • One-click copy to clipboard
  • Shows all color formats (HEX, RGB, HSL, HSV, CMYK)
What's the difference between RGB and HSL?
RGB defines colors by mixing light intensities. HSL defines colors by hue (color type), saturation (intensity), and lightness (brightness).
When should I use HSL?
Use HSL when you need to create color variations (lighter/darker shades) or adjust color intensity without changing the base hue.
Is the conversion accurate?
Yes, the conversion is mathematically precise. The same RGB values will always produce the same HSL values.
Click to pick
rgb(59, 130, 246)
Click to pick
#3B82F6
Click to pick
hsl(217, 91%, 60%)
Click to pick
#3B82F6
Click to pick
hsl(217, 91%, 60%)
Click to pick
cmyk(76%, 47%, 0%, 4%)
Enter RGB as r, g, b or rgb(r, g, b)
Values must be between 0 and 255
HSL output is perfect for CSS hsl() function
Want to learn more? Read documentation →
1/4
Start typing to search...
Searching...
No results found
Try searching with different keywords