CSS text-decoration-color Property

CSS text-decoration-color property specifies the color of the text-decoration line. The color value can be specified in any valid CSS color formats like ‘color name’, ‘HEX’, ‘RGB’, ‘HSL’, etc. See the example below:


  text-decoration-line: underline;
  text-decoration-color: red;
  text-decoration-line: underline;
  text-decoration-color: #3215eb;
  text-decoration-line: underline;
  text-decoration-color: rgb(21, 235, 28);

CSS Syntax

The text-decoration-color property has the following syntax:

text-decoration-color: color|transparent|initial|inherit;

Property Values

The text-decoration-color property accepts the following values:

colorSets the color of the decoration line. It can be any valid CSS color. The default value is currentColor.
transparentSets a transparent decoration line.
initialSets the text-decoration-color property to its default value(currentColor).
inheritInherits the text-decoration-color property from the parent element.

General Info

Default ValuecurrentColor
JavaScript Usageelement.style.textDecorationColor = “blue”