CSS Color Values with Hex Code and RGB

Enjoyed this video? Join my Locals community for exclusive content at nbktechworld.locals.com!
2 months ago
9

The lecture introduces you to another way of specifying a color in CSS.

Previously you learned that you can specify the color name, like red, green, or blue. But there are other ways of defining a color value, like using the hex value or the rgb value.

The hexadecimal value (aka hex) is a value that ranges from 0 to 255 in base 10, but is written in base 16 ranging from 0 to ff. That's why it's called hexadecimal, because one digit can have 16 different characters. It goes from the usual 0 to 9, then after that is goes using the letters a through f.

For the specific case of color hex codes, there are usually six digits. The first two digits are the value for the Red. The middle two digits are the values for the Green. The last two digits are the value for the Blue. Hence the abbreviation RGB whenever you need to compose those three colors to build any one color. For CSS, the hex value is always prefixed with a hash or pound sign.

You can also specify color values using base-10 RGB by saying rgb followed by parentheses. Inside the parentheses you write the values for RGB, separated by a comma. For example, for the Red value, instead of writing ff in hexadecimal, you would write 255 in decimal.

To show the red color, simply use value 255 for Red, 0 for Green, and 0 for Blue.

To show the green color, simply use value 0 for Red, 255 for Green, and 0 for Blue.

To show the blue color, simply use value 0 for Red, 0 for Green, and 255 for Blue.

Loading 2 comments...