In CSS, a color can be specified in several ways, and can apply not just to text but also borders, ALT text, bullet points and ordered lists.
Syntax
color: #RRGGBB;where RR (red), GG (green) and BB (blue) are hex color numbers ranging between 0 and FF.
e.g. color: #ffffff; /* pure white */
Syntax
color: rgb(red,green,blue);Where each parameter (red, green, and blue) can be an integer between 0 and 255 or a percentage value (from 0% to 100%).
e.g. color: rgb(255,0,0);
black, blue, crimson, dodgerblue,indigo, ivory, lightskyblue, red, white, etc - Full List + Samples
e.g. color: red;
In addition to the above there is a new RGBA color format, only supported by more recent web browsers (IE9+, Firefox 3+, Chrome, Safari, Opera 10+)
Syntax
color: rgba(red,green,blue,alpha);
The alpha channel specifies the opacity of the object, a number between 0.0 (fully transparent) and 1.0 (fully opaque).RGBA sets the opacity value only for a single element. unlike opacity which sets the opacity for an element and all of its children.
To deal with older browsers that don't understand RGBA, specify a simple color as a fallback before the RGBA rule:
color: red;
color: rgba(255,0,0,0.5);
When setting the font color for Text it is strongly recommended to also set the background-color in the CSS selector, this ensures that the text will remain readable no matter what the browser/device default background color happens to be.
Try it:
This is a line of sample text we can apply CSS colors to. The background color will also affect the perception and readability of color text. |
(CSS 1) Browser Support: All major browsers.
“Speed kills colour... the gyroscope, when turning at full speed, shows up gray” ~ Paul Morand
Related:
Color - MDN Web Docs.
Background-Color
::selection - Format the background color of text when selected.
Color chooser
-webkit-text-fill-color - Text fill color.