Color Converter — HEX, RGB & HSL
HEX ⇄ RGB ⇄ HSL in sync, with live swatch and copy.
#b84c1f
#b84c1f
r
g
b
rgb(184, 76, 31)
h°
s%
l%
hsl(17.6, 71.2%, 42.2%)
About the Color Converter
Design tools hand you HSL, CSS variables want HEX, and that legacy stylesheet is full of rgb() values. Edit any of the three field groups here and the other two rewrite themselves instantly, while a large swatch shows the color you are actually talking about — no mental arithmetic, no surprises.
Each format has its own copy button producing paste-ready strings (#b84c1f, rgb(184, 76, 31), hsl(18, 71%, 42%)), and invalid entries are flagged in place without losing your last good color. Ideal for theme tuning, design handoffs and translating values between tools.
How to use it
- 1Type a HEX code, or adjust the RGB / HSL channels.
- 2Check the swatch to confirm the color looks right.
- 3Copy whichever format your stylesheet needs.
Frequently asked questions
Related tools
Base64 Encoder & DecoderEncode and decode Base64 instantly, Unicode-safe.URL Encoder & DecoderEscape and unescape URLs and query strings safely.Binary Code TranslatorTranslate text to binary code and back, live.Hex to Text ConverterConvert text to hexadecimal and back, UTF-8 safe.Morse Code TranslatorTranslate, decode and hear Morse code with real audio.ROT13 Encoder / DecoderHide and reveal text with the classic ROT13 cipher.