How Hex Color Codes Work Formula Conversion and Examples
What is Hexadecimal?
Hexadecimal (also known as base - 16 or hex) is a number system that uses 16 different symbols to represent a particular value. The symbols used in hexadecimal are:
0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F
Where, the value of
A = 10
B = 11
C = 12
D = 13
E = 14
F = 15
The place value in hexadecimal is determined by the power of 16, rather than the power of 10 that is used in the decimal form. For example,
3A4₁₆ = 316² + 1016¹ + 416⁰ = 768 + 160 + 4 = 932₁₀
As you must have understood what is hexadecimal, now let us discuss what are hexadecimal colours, hexadecimal colour notation, how does hexadecimal colour code use hexadecimal system, etc.
What are Hexadecimal Colours?
Hexadecimal colour is a method of representing colours from different colour models through hexadecimal values. The format followed in hexadecimal colours are #RRGGBB, where RR is red, GG is green, and BB is blue. The hexadecimal integers can be in the range of 00 to FF to determine the intensity of colours. Considering, 0 as the lowest value and F is the highest value, here is an example to make you understand the hex colour code appropriately.
A simple example of #FF0000 can be understood as, FF = Red, 00 = Green, and 00 = Blue
This implies that the colour is pure red, because the component of red colour has a maximum value of FF, whereas the component of blue and green colours are at their lowest of 00.
Hexadecimal Colours Notation
Hexadecimal colour notation includes (#) symbol followed by 6 different letters or numbers. The first two letters or numbers in Hexadecimal colour code represent the red colour, the next two represent the green colour, and the last two represent the blue colour. The colour values in hexadecimal colour notation range from 00 to FF ( instead of 0 to 255 in RGB).
How Many Hexadecimal Colours are Available?
There are total 256³ or 16,777,216 colour combination available in standard #RRGGBB notation. It is because each colour values RR, GG, BB can include 256 different colour values ranging from 00 to FF. Hence the total number of colour combinations are 256³ or 16,777,216.
Many modern browsers also support transparency. The means that a completely new set of colour code exists in the form of #AARRGGBB. In this, you will find a combination of total 256⁴ or 4,294,976,296 colour codes. It should be noted that the addition of transparency does not indicate that there are extra colours, as only adding transparency does not change the intensity of colours. It solely means that there are more available colour codes depending on level of transparency or opacity.
How To Read Hex Colour Code?
As we know, in a hexadecimal system the values 1- 9 are represented numerically. However, for values that are 10 and higher, letters are replaced by numbers. Accordingly, A = 10, B = 11, C= 12, and so on.
Here are three steps to quickly calculate the hexadecimal numbers.
Multiply the first number by 16
Multiply the second number by 16
Add the total together to obtain single value
For example, the number 83 in hexadecimal form is actually 131. This can be calculated as
816¹ + 316⁰ = 128 + 3 = 131
Working with letters is a similar concept. For example, the value of FF is 255 because you multiply the value of F i.e 15 by 16, then you multiply the value of F i.e 15 by 1. Then add both the values together to get a single value i.e. 255. And the number 255 in hexadecimal colour code represents the bright red colour.
Hexadecimal Colour Example
As we know, hexadecimal decimal colours on a web page are represented as # RRGGBB, where RR is red, GG is green, and BB is blue.
Accordingly,
A nice shade of blue colour can be formed by
Red (64/255 )
Green (48/255 )
Blue ( 255/255)
Hence, (64,48,255) in decimal form is equal to (40,30,FF) in hexadecimal. In Hex colour code, the value is coded as #4030FF.
How Hexadecimal Colour Code Use Hexadecimal Numbers To Minimise Length
There are 255 colour shades each of red, green, and blue (0 - 255) are available. If we want to obtain pure white colour, then it will be represented as #255255255.
Hexadecimal number system is used in hex colour code to represent 256 colours with the help of only two digits. Rather than counting 0,1, 2 ,3, 4, 5, 6, 7, 8, 9,10 in decimal form, it counts 0,1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F,and then 10, followed by 11,12,13,14,15,16,17,18,19,1A,1B,1C,1D,1E,1F, and then 20.
This means that 256 colour shades can be represented with only two digits, rather than 100 that are possible for a decimal number system (0 - 99). Hence, the highest possible two-digit is FF i.e. equals to 255. This is why white is represented as #FFFFFF, pure red as #FF0000, pure green as #00FF00, and pure blue as #0000FF.
Did You Know
Hex colour Code has 16,777, 216 possible colour combinations.
Hexadecimal colours are represented as #RRGGBB, where RR is red, GG is green, and BB is blue
Hexadecimal Colours Example
#000000 - This hex colour code represents pure black colour.
#FFFFFF - This hex colour code represents pure white colour.
#FF0000 - This hex colour code represents pure red colour.
#0000FF - This hex colour code represents blue colour.
#FFFF00 - This hex colour code represents yellow colour.
#00FFFF - This hex colour code represents Cyan colour.
#FF00FF - This hex colour code represents Magenta colour.
#00FF00 - This hex colour code is a mixture of red and green colour, defined as yellow.
#0000FF - This hex colour code is a mixture of more green and maximum blue obtains colour like the sky.
FAQs on Hexadecimal Colors in Maths and Web Design
1. What is a hexadecimal color code?
A hexadecimal color code is a six-digit base-16 number used to represent colors in digital systems like HTML and CSS. It starts with a # symbol and follows the format #RRGGBB, where:
- RR represents the red component
- GG represents the green component
- BB represents the blue component
Each pair ranges from 00 to FF in hexadecimal (0 to 255 in decimal), defining the intensity of each color.
2. How does the hexadecimal number system work in color codes?
The hexadecimal number system is a base-16 system using digits 0–9 and letters A–F to represent values from 0 to 15. In hexadecimal colors:
- Each digit represents a power of 16.
- For example, FF equals (15 × 16) + 15 = 255 in decimal.
- This allows compact representation of RGB values from 0 to 255.
Hexadecimal makes digital color representation shorter and more efficient than decimal notation.
3. How do you convert RGB to hexadecimal color?
To convert RGB to hexadecimal, convert each decimal RGB value (0–255) into a two-digit hexadecimal number and combine them as #RRGGBB.
- Example: RGB(255, 0, 128)
- 255 → FF
- 0 → 00
- 128 → 80
So the hexadecimal color is #FF0080.
4. How do you convert a hexadecimal color code to RGB?
To convert a hex color to RGB, split the six-digit code into three pairs and convert each pair from base-16 to decimal.
- Example: #1A2B3C
- 1A = (1 × 16) + 10 = 26
- 2B = (2 × 16) + 11 = 43
- 3C = (3 × 16) + 12 = 60
So the RGB value is (26, 43, 60).
5. Why are hexadecimal colors based on 16?
Hexadecimal colors are based on base 16 because digital systems operate in binary, and 16 is a power of 2 (2⁴). Each hex digit represents exactly four binary bits.
- 1 hex digit = 4 bits
- 2 hex digits = 8 bits (1 byte)
- Each RGB component uses 1 byte (8 bits)
This makes hexadecimal a compact and efficient way to represent 8-bit color values from 0 to 255.
6. What is the range of values in a hexadecimal color code?
Each component in a hexadecimal color code ranges from 00 to FF, which equals 0 to 255 in decimal. Since there are three components (R, G, B):
- Minimum color: #000000 (black)
- Maximum color: #FFFFFF (white)
This allows a total of 16,777,216 possible colors (256³ combinations).
7. What is the difference between RGB and hexadecimal color codes?
The main difference is that RGB uses decimal numbers while hexadecimal uses base-16 notation to represent the same color values.
- RGB example: (255, 0, 0)
- Hex equivalent: #FF0000
Both describe identical red, green, and blue intensities; hexadecimal is just a shorter, web-friendly format.
8. Can you give an example of calculating a hexadecimal color manually?
Yes, you can calculate a hexadecimal color by converting decimal RGB values into base-16 step by step.
- Example: RGB(75, 150, 200)
- 75 ÷ 16 = 4 remainder 11 → 4B
- 150 ÷ 16 = 9 remainder 6 → 96
- 200 ÷ 16 = 12 remainder 8 → C8
So the hex color is #4B96C8.
9. What is the shorthand 3-digit hexadecimal color code?
A 3-digit hexadecimal color code is a shortened form of #RRGGBB where each pair has identical digits, written as #RGB.
- Example: #FFAA00 can be written as #FA0
- Each digit is duplicated: F → FF, A → AA, 0 → 00
This shorthand works only when both digits in each pair are the same.
10. How many possible hexadecimal colors are there?
There are 16,777,216 possible hexadecimal colors in the standard RGB hex color system. This is calculated as:
- 256 possible red values
- 256 possible green values
- 256 possible blue values
Total combinations = 256 × 256 × 256 = 256³ = 16,777,216, allowing millions of distinct digital colors.
