Last updated
Quick Reference: Common Color Conversions
- #FF0000 = rgb(255,0,0) = hsl(0,100%,50%) — Red
- #00FF00 = rgb(0,255,0) = hsl(120,100%,50%) — Lime
- #0000FF = rgb(0,0,255) = hsl(240,100%,50%) — Blue
- #FFFF00 = rgb(255,255,0) = hsl(60,100%,50%) — Yellow
- #FF00FF = rgb(255,0,255) = hsl(300,100%,50%) — Magenta
- #00FFFF = rgb(0,255,255) = hsl(180,100%,50%) — Cyan
- #808080 = rgb(128,128,128) = hsl(0,0%,50%) — Gray
- #FFFFFF = rgb(255,255,255) = hsl(0,0%,100%) — White
- #000000 = rgb(0,0,0) = hsl(0,0%,0%) — Black
Examples
Example 1: Basic Hex to RGB
Hex → RGB:
#FF0000 → rgb(255, 0, 0) Red
#00FF00 → rgb(0, 255, 0) Green
#0000FF → rgb(0, 0, 255) Blue
#FFFFFF → rgb(255, 255, 255) White
#000000 → rgb(0, 0, 0) Black
#3498DB → rgb(52, 152, 219) Flat UI Blue
#FF5733 → rgb(255, 87, 51) Orange-Red
#808080 → rgb(128, 128, 128) Gray
Example 2: RGB to Hex
RGB → Hex:
rgb(255, 0, 0) → #FF0000
rgb(52, 152, 219) → #3498DB
rgb(46, 204, 113) → #2ECC71
rgb(231, 76, 60) → #E74C3C
rgb(241, 196, 15) → #F1C40F
rgb(155, 89, 182) → #9B59B6
rgb(26, 188, 156) → #1ABC9C
rgb(52, 73, 94) → #34495E
How it works (rgb(52, 152, 219)):
52 → 34 (hex)
152 → 98 (hex)
219 → DB (hex)
→ #3498DB
Example 3: Shorthand Hex Codes
3-digit shorthand → 6-digit full → RGB:
#F00 → #FF0000 → rgb(255, 0, 0)
#0F0 → #00FF00 → rgb(0, 255, 0)
#00F → #0000FF → rgb(0, 0, 255)
#FFF → #FFFFFF → rgb(255, 255, 255)
#000 → #000000 → rgb(0, 0, 0)
#3DB → #33DDBB → rgb(51, 221, 187)
#ABC → #AABBCC → rgb(170, 187, 204)
Rule: Each digit is doubled (#RGB → #RRGGBB)