Text Color

The color property is used to set the color of the text. With CSS, a color is most often specified by:

Look at this color chart for names and hex codes of colors. The default color for all text on a page is defined in the body selector.

HTML file: Displayed by browser:
<style>
body {
    color: rgb(255,255,255);
    background-color: slateblue;
}
h1 {
    color: #00ff00;
}
h2 {
    color: rgb(255,0,0);
}
p.demo {
    color: yellow;
}
</style>
<body>
<h1>This H1 heading is #00ff00</h1>
<h2>This H2 heading is rgb(255,0,0)</h2>
<p>This paragraph is defined by the body selector's color declaration.</p>
<p class="demo">This paragraph is defined by the paragraph selector with the demo class.</p>
<p>This paragraph is like the first paragraph. The background is defined to be slateblue by the body selector's background-color declaration.</p>
</body>

This H1 heading is #00ff00

This H2 heading is rgb(255,0,0)

This paragraph is defined by the body selector's color declaration.

This paragraph is defined by the paragraph selector with the demo class.

This paragraph is like the first paragraph. The background is defined to be slateblue by the body selector's background-color declaration.

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

Back buttonTable of ContentsNext button