CSS Text

In CSS, the term "text" is often used to refer to the styling and layout properties applied to textual content within HTML elements. CSS provides a wide range of properties that allow you to control the appearance of text on a webpage. Here are some key CSS properties related to text:

text formatting

This text is styled with some of the text formatting properties. The heading uses the text-align, text-transform, and color properties. The paragraph is indented, aligned, and the space between characters is specified. The underline is removed from this colored "Try it Yourself" link.

Text Color

In CSS, the color property is used to set the color of the text content within an element. You can specify the color using a variety of formats, including named colors, hexadecimal values, RGB values, or HSL values.

a color name - like "red"
a HEX value - like "#ff0000"
an RGB value - like "rgb(255,0,0)"

Look at CSS Color Values for a complete list of possible color values.
The default text color for a page is defined in the body selector.

Example

body {
  color: blue;
}

h1 {
  color: green;
}

You can click on above box to edit the code and run again.

Output

This is heading 1

This is an ordinary paragraph. Notice that this text is blue. The default text color for a page is defined in the body selector.

Another paragraph.

Text Color and Background Color

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

Example

body {
  background-color: lightgrey;
  color: blue;
}

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

You can click on above box to edit the code and run again.

Output

This is heading

This page has a grey background color and a blue text.

This is a div.