Skip to main content

CSS Text Color

Text Color​

The color property is used to set the color of the text. The color is specified by:

  • a color name, for example "red"
  • a HEX value, for example"#ff0000"
  • an RGB value, for example "rgb(255,0,0)"

The default text color for a page is defined in the body selector

body {  
	color:  blue;  
}  
  
h1 {  
	color:  green;  
}

Full example:

<!DOCTYPE html>
<html>
	<head>
		<style>
			body {
			  color: blue;
			}

			h1 {
			  color: green;
			}
		</style>
	</head>
	<body>
		<h1>This is heading 1</h1>
		<p>This is an ordinary paragraph. Notice that this text is blue. The default text color for a page is defined in the body selector.</p>
		<p>Another paragraph.</p>
	</body>
</html>

Example Text Color

note

For W3C compliant CSS: If you define the color property, you must also define the background-color.

Example: Text Color and Background Color​

In this example, we define both the background-color property and the color property:

body {  
	background-color:  lightgrey;  
	color:  blue;  
}  
  
h1 {  
	background-color:  black;  
	color:  white;  
}  
  
div {  
	background-color:  blue;  
	color:  white;  
}

Table of Contents