Color Converter
Convert between HEX, RGB, and HSL. Pick colors visually with a live preview.
About this tool
Colors on the web can be expressed in multiple formats. HEX (#ff6b6b) is most common in CSS. RGB (255, 107, 107) is useful for programmatic manipulation. HSL (0, 100%, 71%) is intuitive for designers adjusting hue, saturation, and lightness.
Converting designer palettes between formats, generating CSS variable values, matching colors from Figma or Sketch, and building consistent color systems for web applications.
Frequently asked questions
What is the difference between RGB and HSL?
RGB defines color by mixing light channels. HSL defines color by its position on the color wheel (hue), vividness (saturation), and brightness (lightness). HSL is more intuitive for humans to adjust.
What does the alpha channel do?
Alpha controls transparency from 0 (fully transparent) to 1 (fully opaque). In CSS use rgba(255,107,107,0.5) or hsla(0,100%,71%,0.5) for semi-transparent colors.
What is the difference between #RGB and #RRGGBB?
#RGB is shorthand where each character is doubled. #f6b is identical to #ff66bb. The shorthand only works when each hex pair uses the same character.