Color Property is used to declare color in CSS. With CSS you can Declare Color for both Foreground and Background.
By Foreground Color we mean the Color Settings of Elements like Font Color, Border Color, Outlines, Text Color etc. You can easily Declare Color for any HTML Element.
There are many ways to do color declare. However, not all methods are supported by all browsers. So here we are talking about three popular methods. These methods are supported by all browsers.
Three popular ways to add CSS Color:
- Hex Value
- RGB Value
- Color Name
Add Color by Hex Value
Hex means Hexadecimal. Hexadecimal Code is a 6 digit code. In which hex values of Red, Green and Blue colors respectively. The first two digits represent Red, the middle two represent Green and the last two represent Blue.
Hexadecimal values are Alphanumeric. Which includes both Alphabets and Numbers. You can write Hex Value in either Lowercase or Uppercase. Since Lowercase is easy to write and Uppercase is easy to read.
Example :-
p { color: #000000; } h1 { color:#000; }
Add Color by RGB Value
RGB is composed of three words. In which R means Red, G means Green and B means Blue. The RGB value of the colors is written by RGB. You can also declare the RGB value as a percentage.
Intensity of a color between 0 and 255 is represented by RGB. The more value you declare for a color, the more the color will appear in the color.
Example :-
p { color: rgb(255,0,0); }
Color Name
You can also declare the color value by the color name. Which is the easiest way. However, you cannot declare all colors by their name. Nor is it possible to do so.
Declare Color by their name is easy, but not all browsers support Color Name. Therefore this method is not used much.