CSS Color
Written by
Colors add life to an HTML page.
Background Color:
The CSS treats each HTML element as if it appears in a box, and the background-color property sets the color of the background for that box.
The background colors can be specified using predefined color names or by using REB values, HEX codes etc. Example,
body {background-color: blue;}
Or
<body style=”background-color: blue”>
Text color:
To set the text color, we use ‘color’ property. It allows us to specify color of text in an element. For example,
p{ color: rgb(100,90,80);}
Border color:
Border color is added using ‘border-color’ property in a much similar way as we add the background color or text color.
Color values:
RGB values – they are normally written as rgb(red, green, blue). Each parameter (red, green, and blue) defines the intensity of color from 0 to 255. For example, rgb(150,200,180).
RGBA value – it refers to rgba(red, green, blue, alpha). Alpha denotes transparency of the color. It is a number between 0.0 and 1.0 where 0.0 means fully transparent and 1.0 means not transparent at all.
HEX values – they are normally written as #rrggbb where rr is red, gg is green and bb is blue and these are hexadecimal values between 00 and ff (same as decimal 0 to 255). For example, #55bdaa
Color names – colors are represented as predefined names. However, they are very limited in number.
HSL value – these are represented as hsl(hue, saturation, lightness). Hue ranges from 0 to 360 where 0 means red.
Saturation is percentage value and refers to amount of grey shade n a color and ranges from 0% to 100%. 0% means completely gray and 100% means no gray at all. Lightness is also a percentage from 0% to 100%. At 100% there will be no black in the color and 0% is completely black which means no light.
