hslrgb
HSL to RGB Converter
Convert a HSL colour to RGB, with a live swatch and every other notation alongside.
To convert HSL to RGB, paste your colour above — any recognisable notation is accepted, including named CSS colours — and every format is shown at once with a live swatch. RGB gives each channel as 0–255. It is the same colour space as hex, just written differently, and adds an alpha channel as a fourth value.
Runs in your browserAbout converting HSL to RGB
HSL separates hue from saturation and lightness, which is why it is the notation to reach for when generating a tint or shade: change one number, keep the hue. RGB gives each channel as 0–255. It is the same colour space as hex, just written differently, and adds an alpha channel as a fourth value.
Share this converter
Related tools
Tailwind Colour Shade GeneratorGenerate a full 50–950 Tailwind colour scale from a single brand colour.CSS Named Colours ReferenceEvery CSS colour name with its HEX, RGB, HSL and OKLCH value, sortable by hue and contrast.CSS Box Shadow GeneratorDesign a CSS box-shadow with live values for offset, blur, spread and colour.Glassmorphism CSS GeneratorCreate frosted-glass CSS with backdrop blur, transparency and a subtle border.CSS Gradient GeneratorBuild linear, radial and conic CSS gradients and copy the code.PX to REM ConverterConvert between pixels, rem and em using your project root font size.