Connect with us

HTML Color Codes and Converting RGB to Hexadecimal


Tips and Tricks

HTML Color Codes and Converting RGB to Hexadecimal

When I redesigned my blog, I wanted my Adsense unit to merge properly with the background of the theme. My earlier theme had white background, so it was never a problem to integrate the ads. The sidebar of my new theme has a unique color and I wanted the background of my Adsense unit to have the same color. Adsense setup has only a small collection of colors (although we can manually enter the colors). I didn’t have Photoshop or a GIMP installed in my system (office computer from where I blog). Now the question is how to get the correct color code when you don’t have any picture editors?

This is pretty simple! I took screen shot of my blog and pasted in paint. Using the color picker, I selected the color of my sidebar. Now paint displays color in RGB format and I wanted it in hexadecimal format. My color was RGB (216, 217, 198). HTML colors codes are made up of 3 sets of hex numbers, one for Red, one for Green, and one for Blue and to get the color code in hexadecimal format is very simple.

Here the calculator that comes with Windows is handy, to convert between Decimal and Hex values. Open the calculator and select View and then Scientific. Once you do this, you’ll see more buttons and controls on the calculator. Click “Dec” and the key in a number (the number that is specific to red). Now click “Hex” and it’ll convert the number to hex. To convert from Hex to Dec, click on “Hex”, key in the number, and then click “Dec”. Sometimes you’ll get a color specification in Decimal, for example (128, 30, 80) and you can use this method to convert it to hex (80, 1E, 50) which would look like this for your HTML color #801E50. (Imp: Don’t key in all the three numbers and convert to hexadecimal, this would give a different combination) The decimal part for a color varies from 0-255 and we can have different combinations by varying this RGB combination.

Here are some of the common colors and their decimal and hexadecimal codes.

000000 is black (0’s for all three colors)
FFFFFF is white (255’s for all three colors)
FF0000 is all RED (255 for Red, 0 green, 0 blue)
00FF00 is all GREEN (0 Red, 255 green, 0 blue)
0000FF is all Blue (0 red, 0 green, 255 blue)
FFFF00 is Yellow (255 red, 255 green, and 0 blue)
808080 is a gray (128 red, 128 green, and 125 blue)

Next time when you face this issue, try our this method. There is a small software (62 kb), Pixie, which will tell you the Hex, RGB, HTML, CMYK and HSV values of any color.

Technorati tags: , ,

Continue Reading
Advertisement
You may also like...

Nirmal is a Technology Blogger and a Microsoft MVP in Windows. He can be contacted at nirmal@nirmaltv.com. You can find Nirmal on , and .

6 Comments

6 Comments

  1. Rishi

    April 27, 2007 at 12:35 pm

    Hey thanks! I was searching a reference for this from a long time. 🙂

  2. Silki

    April 27, 2007 at 8:33 pm

    Hi Nirmal,
    I think there is a very simple tool called “Color Cop” available exactly for the same purpose. You can download it at http://www.colorcop.net. It will not take more than 5 seconds (yes 5 seconds) to determine the hex colour code of any pixel on your screen. The use is extremely easy.
    I am a total new entrant to the blogosphere and had just shot off my blog webtools-desinet1.blogspot.com. I have not even finished its template part.
    I would love to hear from you.

  3. nirmaltv

    April 27, 2007 at 10:45 pm

    @Rishi,
    Thanks for your feedback, hope it was useful for you.

    @Silki,
    Thanks for letting me know about the software. I have also mentioned about another software Pixie, which can convert to all formats.

  4. Pingback: Link O! Byte - 2

  5. Pingback: Links this week

  6. Arun Kumar

    December 1, 2014 at 1:10 pm

    How to video is available on the below link

    https://www.youtube.com/watch?v=LN5wOd6Nw7s

Leave a Reply

Your email address will not be published. Required fields are marked *

Recent Articles

Advertisement

Trending Articles

Latest in Windows 10

Subscribe to YouTube Channel

Like Us on Facebook

Sponsors

sponsors
To Top