Convert any color between HEX, RGB and HSL. Edit any of the three representations and the others follow instantly, with a live swatch and the complementary color (the hue 180° around the wheel) shown beside it.
HEX and RGB describe exactly which red, green and blue light to mix; HSL is human-friendly — hue (position on the color wheel), saturation (intensity) and lightness — which makes it the natural way to build palettes.
Frequently asked questions
What is the difference between HEX and RGB?
Nothing functional — #ff8800 and rgb(255, 136, 0) are the same color written two ways.
What is a complementary color?
The color opposite on the wheel: orange #ff8800 complements azure #0088ff. Pairing them gives maximum contrast.
When should I use HSL?
For building palettes: keep hue, adjust lightness for shades, saturation for muted variants — much easier in HSL than RGB.
中文说明
在 HEX、RGB、HSL 三种表示之间转换颜色。编辑任意一种表示，其余两种即时联动，旁边还实时显示色块与互补色（色相环上相差 180° 的颜色）。
HEX 和 RGB 直接描述红绿蓝光的混合比例；HSL 更符合人的直觉——色相（色环位置）、饱和度（鲜艳程度）、亮度——是搭配配色方案的自然选择。
常见问题
HEX 和 RGB 有什么区别？
功能上没有区别——#ff8800 与 rgb(255, 136, 0) 是同一颜色的两种写法。
什么是互补色？
色环上正对面的颜色：橙色 #ff8800 的互补色是天蓝 #0088ff，两者搭配对比度最强。
什么时候用 HSL？
做配色方案时：固定色相、调亮度得深浅变体、调饱和度得柔和变体——比在 RGB 下容易得多。