Setting Color Property in CSS

CSS Web Development Front End Technology

We can define colors for text, borders and background of elements using CSS. The color property is used to specify the text color for an element.

Syntax

The syntax for CSS color property is as follows −

Selector {
   color: /*value*/
}

The following examples illustrate CSS color property −

Example

Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
div {
   color: seashell;
   background-color: lightcoral;
}
p {
   font-size: 1.5em;
   color: blue;
   background-color: palegreen;
   box-shadow: 0 0 5px 1px rgb(0,0,0);
}
</style>
</head>
<body>
<div>
This is demo text.
<p>
Text added for reference.
</p>
This is demo text 2.
</div>
</body>
</html>

Output

This gives the following output −

Example

Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
* {
   text-align: center;
}
h3 {
   color: red;
   border: 2px ridge rosybrown;
}
p {
   color: royalblue;
   background-color: cornsilk;
   box-shadow: 0 0 5px 1px deeppink;
}
</style>
</head>
<body>
<h3>Demo Demo Demo Demo</h3>
<p>Demo text here</p>
</body>
</html>