Enter HSL Values
Input or choose HSL values
See Results
View HEX and other formats
Copy or Use
Copy, save, or reuse your color
Choose a color visually, use sliders, or paste a value.
Quick Presets
#FF6347
tomato
PreviewOriginal
rgb(255, 99, 71)
Lighten 20%
rgb(255, 130, 108)
Darken 20%
rgb(204, 79, 57)
Complementary
rgb(71, 227, 255)
Aa
With White Text
Aa
With Black Text
Other Formats
Color Palette
Did you know?
You can pick a color from your screen in browsers that support the EyeDropper API.
Convert HSL values into a six-digit hex code for compact CSS, design tokens, and API payloads.
Locking in a color after adjusting hue, saturation, and lightness visually.
Looking for more notations? Try the Color Converter for HEX, RGB, HSL, LAB, OKLAB, and OKLCH; or Color Contrast Checker to validate your foreground/background combinations.
Are percentages required?
The percent sign is accepted for saturation and lightness; plain numbers are also parsed.