CSS Text Color
The color property sets the foreground color of an element's text and is inherited by its descendants.
The <color> property controls the color of text content. Because color is an inherited property, setting it on a parent element cascades down to its children unless a child sets its own color.
Ways to specify a color
Coloring headings and body text
<!DOCTYPE html>
<html>
<head>
<style>
body {
color: #333333;
}
h1 {
color: #00643c;
}
</style>
</head>
<body>
<h1>Page Title</h1>
<p>This is some body text.</p>
</body>
</html>Keep contrast in mind
Text needs enough contrast against its background to stay readable. Very light gray on white, for example, is hard to read for many people.
Readable link color
<!DOCTYPE html>
<html>
<head>
<style>
a {
color: hsl(153, 100%, 25%);
}
</style>
</head>
<body>
<a href="#">Visit our blog</a>
</body>
</html>Note: For more on the color formats themselves, visit the CSS Colors page.
