Hex Color Value Examples
Hex color codes are the most common way to specify colors in CSS and design tools, but understanding what the hex digits represent helps you reason about color relationships. Each pair of hex digits encodes the red, green, and blue channel from 0 (00) to 255 (FF). This collection shows common web colors with their hex, RGB, and HSL equivalents. The hex-to-RGB converter breaks down any hex color into its channel values and lets you convert between all three CSS color formats.
Example
#FFFFFF = rgb(255, 255, 255) = hsl(0, 0%, 100%) /* White */ #000000 = rgb(0, 0, 0) = hsl(0, 0%, 0%) /* Black */ #FF0000 = rgb(255, 0, 0) = hsl(0, 100%, 50%) /* Red */ #00FF00 = rgb(0, 255, 0) = hsl(120, 100%, 50%)/* Green */ #0000FF = rgb(0, 0, 255) = hsl(240, 100%, 50%)/* Blue */ #FFFF00 = rgb(255, 255, 0) = hsl(60, 100%, 50%) /* Yellow */ #FF6B35 = rgb(255, 107, 53) = hsl(18, 100%, 60%) /* Orange */ #6B46C1 = rgb(107, 70, 193) = hsl(263, 47%, 71%) /* Purple */
FAQ
- What does the # mean in a hex color code?
- The # is just a prefix that tells CSS the following characters are a hexadecimal number. Without it, the value is not recognized as a color. The six hex digits represent RRGGBB channel values.
- Can I use 3-digit hex colors?
- Yes. A 3-digit hex color is shorthand for a 6-digit one where each digit is doubled: #RGB = #RRGGBB. So #F00 is the same as #FF0000 (red) and #ABC = #AABBCC.
- When should I use HSL instead of hex?
- HSL (Hue, Saturation, Lightness) is more intuitive for creating color palettes because you can adjust lightness and saturation independently. Hex is better for exact color matching from design specs.
Related Examples
Binary, Decimal, and Hex Conversion
Understanding number base conversions is fundamental to low-level programming, n...
Percentage Calculation ExamplesPercentage calculations appear constantly in e-commerce (discounts), finance (in...
Hex Dump and Text-to-Hex EncodingA hex dump shows the hexadecimal byte values of text or binary data alongside it...