Wednesday, September 23, 2015

All about Colors

HTML Color

There are four different ways to use colors in CSS. You can use RGB, RGBA, Hexadecimal, and color names. They all have advantages some are easy to use than others, this tutorial will show you all the different types and situations to use them in. With RGB, RGBA, and Hex there are 16,777,216 different colors but you can only use 256 on the web.

Color words

Colors words are the easiest out of the four ways to add colors to word in HTML but they also do the least. To add colors words to tags you just add the name of the color you want. Color words are the least used way because they are very limited in the amount of colors you can use in your web page.

Ex.
<p style="color: Red;">Hello</p>
Hello

Links:

Hexadecimal

The hex system for colors is base 16 and are 6 digits long(Hex meaning 6 in latin), and look like #FF0000. The system goes from 0-F Both RGB and Hex codes have the same amount of colors for the web. The order for hex codes go "RRGGBB" Red Green Blue. Each one of the values you be a character from 0-F. F being the most of one color and 0 being none of that color. Web colors are all hex codes that are doubled like #00FF33 or #55DD22 but like #12FC5A

Ex.
<p style="color: #FF0000;">Hello</p>
Hello


RGBA and RGB

RGB and RGBA are almost the same system they use different amounts of red green and blue. Each color goes from 0-255 (256 different numbers).The a on RGBA stands for alpha it is a value from .0-1 it is the transparency value.

Ex.
<p style="color: rgba(255,0,0,1);">Hello</p>
Hello


<p style="color: rgb(255,0,0);">Hello</p>
Hello

Here is a picture of how transparency can be used.


In Conclusion

All of the different types of color choices work in HTML 5 and they all have there different uses. You can refer to my other blogpost for examples of each type.

1 comment: