CSS Colors

CSS Colors allow you to change the color of text and backgrounds in your HTML pages. You can specify colors using color names, hexadecimal codes, RGB values, or HSL values. Let's explore each of these options:

Color Names

You can use predefined color names in CSS to specify colors. Some common color names include red, blue, green, yellow, and black. Here's an example of how you can use color names in your CSS:

p {
  color: blue;
  background-color: yellow;
}

Hexadecimal Codes

Hexadecimal codes are a way to represent colors using a combination of six characters - three pairs of numbers and letters. Each pair represents the intensity of red, green, and blue in the color. Here's an example of how you can use hexadecimal codes in your CSS:

p {
  color: #ff0000; /* Red */
  background-color: #00ff00; /* Green */
}

RGB Values

RGB values allow you to specify colors using the intensity of red, green, and blue in the color. Each value ranges from 0 to 255. Here's an example of how you can use RGB values in your CSS:

p {
  color: rgb(255, 0, 0); /* Red */
  background-color: rgb(0, 255, 0); /* Green */
}

HSL Values

HSL values allow you to specify colors using hue, saturation, and lightness. Hue is a degree on the color wheel, saturation is a percentage value, and lightness is also a percentage value. Here's an example of how you can use HSL values in your CSS:

p {
  color: hsl(0, 100%, 50%); /* Red */
  background-color: hsl(120, 100%, 50%); /* Green */
}