A Grip On CSS Color Codes


CSS Color Codes are often a mystery to novice HTML / CSS developers. # FF0000 … What might that mean?

CSS Color Codes are actually hexadecimal values ​​of a specific color. If you've worked in Photoshop's color picker, you must have seen these codes.

The alternative to hexadecimal color codes are RGB color codes. RGB stands for Red Green Blue. So if you want to specify a specific color, you'll set each color value separately, for example R: 255 G: 0 B: 0. Bear in mind that the minimum value is 0, and maximum value is 255, so in this example we have specified red color.

Hexadecimal color values ​​also function this way, so if you want to specify a color, you will combine RGB values ​​converted into hexadecimal numbers like this:

Red: 255 = FF

Green: 0 = 00

Blue: 0 = 00

Result: # FF0000

To make all these Color Codes work for you, you must embedd them into your CSS statement like this:

style = "color: # FF0000;"

The alternative way is to specify a RGB value lake this:

style = "color: rgb (255,0,0);"

and the easiest way to specify color using CSS is this:

style = "color: red;"

The last example for setting the color by color name has some limitations though: There are only 16 colors that you can use: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver , teal, white, and yellow.

And the final tip for hexadecimal CSS Color Codes is that you can abbreviate. Hexadecimal code can be shortened if the pairs have same values. For instance, if you want to specify a red color, you'd write # FF0000. To make it shorter you can safely write # F00, as you abbreviated code like this:

FF = F

00 = 0

00 = 0

Result: # F00

That's it,

Happy Coding!


Leave a Reply