CSS Text color

In CSS, the color property is used to set the color of text. You can specify the color using different formats, such as named colors, HEX values, RGB values, RGBA values, HSL values, and HSLA values. Here’s a detailed guide on how to use the color property to style text:

Syntax


color: value;

Color Format values

1. Named Colors:


p {
  color: red;
}

2. HEX Values:


p {
  color: #ff0000;
}

3. RGB Values:


p {
  color: rgb(255, 0, 0);
}

4. RGBA Values:


p {
  color: rgba(255, 0, 0, 0.5); /* The last value is the alpha (opacity) */
}

5. HSL Values:


p {
  color: hsl(0, 100%, 50%);
}

6. HSLA Values:


p {
  color: hsla(0, 100%, 50%, 0.5); /* The last value is the alpha (opacity) */
}

Example: Basic Example with Named Colors


<!DOCTYPE html>
<html lang="en">
<head>
    <style>
        p {
            color: blue;
        }
    </style>
</head>
<body>
    <p>This is a paragraph with blue text.</p>
</body>
</html>

This is a paragraph with blue text.