HSL to HEX Converter

Convert HSL colors to HEX instantly

HEX, RGB, HSL, HWB, Lab, LCH, Oklab, OKLCH, Display P3, and CSS names

#5CCC7FFF
H139°
Alpha100%
Preview
On light
On dark

Everything is processed locally in your browser.

hsl
hex
HEX → HSL
HEX
RGB
OKLCH
HEX + AlphaRRGGBBAA
RGB + Alpha
HSL
HSL + Alpha

CSS HEX uses RRGGBBAA; Android and Flutter use AARRGGBB.

Recent colors

Converted colors will appear here.

Related Tools

HEX to HSL ConverterConvert HEX colors to HSL instantlyColor ConverterConvert colors across CSS, mobile, and design-token formatsCSS Beautifier & MinifierFormat, optimize, and minify CSS codeCode Screenshot GeneratorCreate beautiful, shareable images of your code
Overview

Convert HSL colors directly to HEX while preserving the represented sRGB color and alpha where the target syntax supports it. This page starts with HSL input and places the HEX result first.

How it works

Enter HSL such as hsl(139 52% 58%). The shared browser engine validates the channels, converts through one canonical color model, and updates the focused HEX value, preview, contrast, and additional developer formats instantly.

Examples and uses

Use HSL to HEX conversion when moving colors between CSS, design handoffs, application code, or print-oriented specifications. Copy the focused result without uploading the color value.

Edge cases and limitations

HSL hue wraps around 360 degrees, while saturation and lightness require percentages. HEX supports 3, 4, 6, and 8 digits; 8-digit CSS values use RRGGBBAA ordering.

Reverse conversion

Need the opposite direction? Use the linked HEX to HSL converter. Swapping keeps the URL, heading, initial input, and primary result aligned with that intent.