Color Converter
Convert between hex, RGB, RGBA, HSL, HSLA, and named colors. Input any format and see instant conversion with live color preview.
- Free forever
- Instant results
- Private — runs in your browser
Try: #FF6B6B, #F6B8, rgb(255 107 107 / 80%), hsl(0, 100%, 71%), rebeccapurple
#FF6B6B, rgb(255, 107, 107), hsl(0, 100%, 71%)
Detected format: HEX
#FF6B6Brgb(255, 107, 107)rgba(255, 107, 107, 1)hsl(0, 100%, 71%)hsla(0, 100%, 71%, 1)Colour channels
Quick reference colours
How to use the Color
Enter a colour in any CSS format — hex (#FF6B6B, #F6B, or 8-digit #FF6B6BCC with alpha), RGB (rgb(255, 107, 107) or rgb(255 107 107 / 80%)), HSL (hsl(0, 100%, 71%)), or a CSS colour name such as rebeccapurple. You can also pick a colour with the colour picker. Every equivalent format is shown with a copy button.
Formula
Colour models:
• HEX: #RRGGBB (or #RRGGBBAA), each pair a 0–255 value in base 16
• RGB: red, green, blue channels from 0–255
• HSL: hue 0–360°, saturation 0–100%, lightness 0–100%. L = (max + min) / 2; S = (max − min) / (1 − |2L − 1|); H depends on which channel is largest.
All formats describe the same sRGB colour; HSL values are rounded to one decimal place.
History & interesting facts
Did you know?
24-bit RGB can encode about 16.7 million colours (256³) — more distinct colours than most people can tell apart, which is estimated at around 1 to 10 million.
Origin & history
Hex colour codes became standard on the web in the 1990s with HTML and CSS. HSL was added in CSS3 to give designers a more intuitive way to describe colours.
Fascinating facts
- 1
Hex (#RRGGBB): each pair represents 0–255 in hexadecimal; #RGB is shorthand that doubles each digit
- 2
RGB: direct representation of red, green and blue intensities
- 3
HSL: hue (colour), saturation (intensity), lightness (brightness) — intuitive for designers
- 4
RGBA/HSLA and 8-digit hex add an alpha channel for transparency
- 5
Greys have equal R, G and B values (e.g. #808080)
- 6
CSS defines 148 named colours, from aliceblue to yellowgreen
Frequently asked questions
What is the difference between RGB and HSL?
RGB uses red, green and blue intensities directly. HSL uses hue (colour), saturation (colourfulness) and lightness (brightness). Both describe the same colours; HSL is often more intuitive for designers.
Can I use transparency in colours?
Yes. Use RGBA or HSLA, the modern slash syntax such as rgb(255 0 0 / 50%), or an 8-digit hex code like #FF000080. Alpha ranges from 0 (transparent) to 1 (opaque).
What are named colours?
CSS defines 148 named colours, such as red, teal and rebeccapurple. They are shortcuts for specific hex values.