CSS Color Names

<p style="color: Red;">Test text...</p>

Test text…

  • white
  • black
  • red
  • orange
  • yellow
  • green
  • cyan
  • blue
  • purple
  • pink
  • gray
  • brown

Color Values

1. RGB Value

The CSS rgb() function, It allows you to specify an RGB color value by specifying the red, green, and blue channels directly.

<p style="color: rgb(148,0,211);">Test text...</p>

Test text…

2. RGBA Value

The CSS rgba() function, It allows you to specify an RGB color value, as well as an alpha value to determine the color’s transparency.

<p style="color: rgba(30 ,255,50, 0.5);">Test text...</p>

Test text…

3. HEX Value

Here is using hexadecimal notation instead of the color name.

<p style="color: #963c1e;">Test text...</p>

Test text…

4. HSL Value

The CSS hsl() function, It allows you to specify a color value by specifying the hue, saturation, and light components of the color.

The first value: as an angle in degrees.

The second value: It represents the amount of saturation in the color. (%)

The third value: It represents the amount of light in the color. (%)

<p style="color: hsl(240,100%,50%);">Test text...</p>

Test text…

5. HSLA Value

The CSS hsla() function can be used to add transparency to a color when using the HSL model.

<p style="color: hsla(30, 100%, 50%, 0.5);">Test text...</p>

Test text…