So you know the RGB values of a pixel. This may sound very unimpressive but this may also be the color of an entire font (characters) or a background. In order to use the same color on your website it is advisable to convert the RGB value to its hexadecimal value. Suppose we found out that the color of a steel blueish font is RGB (38,122,169). What would be its hexadecimal value?
Step 1
On your windows computer press start, choose 'Accessories’ and then ‘Calculator'. A calculator will now appear on your screen.
Step 2
On this calculator window select 'View' and check 'Scientific'. If you have never changed its default value of 'standard' the calculator will now look bigger than it was before.
Step 3
We will now use RGB(38,122,169) as an example.
Step 4
Enter the first number, 38.
Step 5
On the left hand side select the radio button 'Hex'.
Step 6
By doing so the number 38 will change to 26. Jot it down.
Step 7
Select the radio button 'Dec'. The number 38 will reappear.
Step 8
Clear the number (by pressing the right hand button 'C'), and make sure that the radio button is on 'Dec'.
Step 9
Repeat steps 5 to 8 for the second number, 122. This will turn out to be 7A.
Step 10
Repeat the same steps for the third and last number, 169. This will be turn out to be A9.
Step 11
When one of the numbers jotted down is only one digit long (as opposed to two in our example) then make it two digits long by putting a zero in front. E.g. 11 would convert to B, and you should change this into 0B.
Step 12
Concatenate the three numbers of two digits each, in their right order. We jotted down 26, 7A and A9, so the concatenated value is 267AA9.
Step 13
Add the symbol '#' in front of the result. The hexadecimal color code is now #267AA9.
Step 14
If it is important check the result in a website that creates the color entered. (Full codes only).
Tips
- There are plenty of websites and programs that can do this conversion for you. The claim to fame of this article is that you understand a little bit how these are working.
- Understand that you merely converted three decimal numbers to its hexadecimal counterpart and concatenated them in their right order.
- Understand that using the built in calculator is only one of the many ways you can convert a decimal number to its hexadecimal counterpart.
- By messing with the first digits of the tree numbers you will get an entirely different color. By messing with the last digits you might not be able to see the difference.
- Sometimes the RGB values are given in percentages. E.g RGB(15%,48%,66%). They mean percentage of the maximal possible value of 255. So 15% would be 15*255/100 = 38.25 which can and should be rounded to 38.
- When all of the three separate hexadecimal numbers are in the list 00, 33, 66, 99, CC, FF you have a so called 'websafe' color. There are only 216 of these but they will generally get the job done.
- For websafe colors you can use shorthand, using only 3 digits. E.g. #336699 = #369.
- Some colors are more famous than others. When your color has a html-name (only a tiny fraction of the 16,777,216 possible colors) you will discover this soon enough when you submit the hexcode to google.
- When you are used to mixing paints or inks this color system may not make sense to you. E.g. you may expect to make brown (or at least some darker color) by choosing #FFFF00, the brightest possible red combined with the brightest possible green. But you get... bright yellow!
- This is because it has nothing to do with inks or paints. Picture it as shining a red and a green flash light, properly adjusted, on a white paper in a dark room. The paper will now appear yellow.
