# Convert HSL to HEX

> Convert HSL color values to HEX online. Free HSL to HEX converter with a worked example — turn hue, saturation, and lightness into a hex code.

Designed a color in HSL and need it as hex for CSS or a design token? This converter resolves hue, saturation, and lightness back into red, green, and blue, then formats the result as a six-digit hex code.

## Example: HSL → HEX

Input:
```
hsl(6, 63%, 46%)
hsl(164, 76%, 47%)
hsl(213, 100%, 66%)
```

Output:
```
#bf3a2b
#1dd3a2
#52a0ff
```

## How to convert HSL to HEX

1. Take your HSL value, e.g. hsl(6, 63%, 46%).
2. Convert hue, saturation, and lightness back to RGB channels.
3. Format each channel as two hex digits — here that lands on #bf3a2b, one step off the original due to HSL rounding.

## FAQ

### Does HSL to hex round-trip exactly?

Usually within one digit. Because HSL components are often rounded, converting back can land a single step off the original hex — visually identical, numerically close.

### Can I include alpha?

Standard hex output is six digits with no alpha. For transparency, keep the color in hsla() or append an alpha pair as #rrggbbaa.

## Related converters

- [HEX → HSL](https://www.devkult.com/convert/hex-to-hsl.md)
- [RGB → HEX](https://www.devkult.com/convert/rgb-to-hex.md)
- [HSL → RGB](https://www.devkult.com/convert/hsl-to-rgb.md)

Open the interactive converter: https://www.devkult.com/convert/hsl-to-hex