CSS color Property

CSS color property specifies the foreground color of the text content for an element.

Usages

The following table outline the usages and version history of this property.

Default value: Depends on the browser
Applies to: All elements
Inherited: Yes
Version: CSS1
JavaScript Syntax: object.style.color = "#000000"

Syntax

Here is a syntax for the CSS color property

color: color | initial | inherit;

Property Values

The following table describes the values of this property.

Value Description
color Specifies the text color
Value Description
color name Name of the color (i.e. red, pink, blue)
#xxxxxx Hexadecimal representation of the text color
rgb(x, x, x) RGB representation of the text color
rgba(x, x, x, x) RGBA representation of the text color
hsl(x, x, x) HSL representation of the text color
hsla(x, x, x, x) HSLA representation of the text color
initial Sets default value of this property
inherit Inherits this property from its parent element

Examples

The example below shows to sets text colors.

.color-1 {
  color: pink;
}
.color-2 {
  color: #888888;
}
.color-3 {
  color: rgb(255, 167, 0, 0.9);
}
.color-4 {
  color: hsl(45, 70%, 50%, 0.9);
}

Run it...   »

Browser Compatibility

  • Google Chrome 1+
  • Mozilla Firefox 1+
  • Internet Explorer 3+
  • Opera 3.5+
  • Safari 1+

Note: Here details of browser compatibility with version number may be this is bug and not supported. But recommended to always use latest Web browser.