Expand All | Collapse All

CSS3 text-decoration-color Property

Topic: CSS3 Properties ReferencePrev|Next


The text-decoration-color CSS property specifies the color of the text-decoration-line (underlines, overlines, linethroughs) set on the element.

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

Default value: The current color of the element
Applies to:
All elements. It also applies to ::first-letter and ::first-line.
Inherited: No
Animatable: Yes. See animatable properties.
Version: New in CSS3


The syntax of the property is given with:

color | initial | inherit

The example below shows the text-decoration-color property in action.

p {
    text-decoration: underline;
    -moz-text-decoration-color: red; /* Firefox */
    text-decoration-color: red; /* Standard syntax */

Property Values

The following table describes the values of this property.

Value Description
color Specifies the color of the text-decoration-line. See the CSS Color Values to learn more about the valid color values.
initial Sets this property to its default value.
inherit If specified, the associated element takes the computed value of its parent element text-decoration-color property.

Browser Compatibility

The text-decoration-color property is not supported in most of the browsers.

Browsers Icon

Basic Support—

  • Firefox 6+ -moz-, 36+
  • Google Chrome ×
  • Internet Explorer ×
  • Apple Safari ×
  • Opera ×

Warning: The text-decoration-color property is currently not supported by the most of the browsers. You should better avoid using this property.

Further Reading

See tutorial on: CSS Text, CSS Color, CSS Border.

Related properties: text-decoration, text-decoration-line, text-decoration-style.

Bootstrap UI Design Templates Property Marvels - A Leading Real Estate Portal for Premium Properties