Understanding Color Formats
Colors on the web can be represented in several formats. Each has its use case: HEX is compact, RGB is intuitive, and HSL makes it easy to adjust brightness and saturation.
Color Format Comparison
HEX
#RRGGBB
Compact, widely used in CSS. Each pair represents 0-255.
RGB
rgb(R, G, B)
Red, Green, Blue values from 0-255.
HSL
hsl(H, S%, L%)
Hue (0-360), Saturation (0-100%), Lightness (0-100%).
Pro Tips
- Use HSL when you need to create color variations (lighter/darker versions)
- HEX colors can be shortened: #FF0000 = #F00
- RGBA/HSLA add alpha channel for transparency