CSS Reference Property
text-decoration-color 305i3k
This property specifies the color of text decoration (underlines, overlines and line-throughs) set on the element with text-decoration-line. 3g6o5a
The default value for the text-decoration-color
property is currentColor
, which, as the name suggests, sets the color of the text decoration to the current color applied to the text using the color
property, which could be inherited if no specific value is set.
Official Syntax 2r1j5a
- Syntax:
text-decoration-color: <color>
- Initial: currentColor
- Applies To: all elements
- Animatable: yes, as a <color>
Values 291l5
- <color>
-
The color value accepts various keywords and numeric notations. See
<color>
values for more details.
Examples 2t4m6h
The following snippet sets an underline decoration (using the text-decoration-line
property) on all h1
elements in a page and colors the underline red.
h1 { text-decoration-line: underline; text-decoration-color: red; }
Other examples:
p { text-decoration-color: #eee; } .overlined-text { text-decoration-line: overline; text-decoration-color: rgba(0,0,0,0.25); }
Live Demo 3h4i39
View this demo on the Codrops PlaygroundBrowser f3k20
The property is currently only ed in Firefox 6+, and it needs the -moz-
prefix.