Typography is an incredibly powerful design feature and, in reality, styling text with CSS is actually simple.
The color
CSS property defines the color of the text and looks like this:
color: red;
Alternatively, it can look like this:
color: #f00;
The color
property supports all color modes, HEX
, RGB
, RGBa
, HSL
, HSLs
, and color name.
CSS:
/*Color Name*/ .element { color: red; } /*HEX*/ .element { color: #f00; } /*RGB*/ .element { color: rgb(255, 0, 0); } /*RGBa - Color has 50% opacity*/ .element { color: rgba(255, 0, 0, .5); } /*HSL*/ .element { color: hsl(0, 100%, 50%); } /*HSLa - Color has 50% opacity*/ .element { color: hsla(0, 100%, 50%, .5); }