Widely availableUseful when text-decoration adds a clear capability without requiring fragile workarounds.
Other Widely available

text-decoration

The text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.

Other

Overview

The text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
text-decoration
1
12
1
1
18
1
Other
css.properties.text-decoration-color

The text-decoration-color CSS property sets the color of decorations added to text by .
57
79
36
12.1
57
12.2
css.properties.text-decoration-line

The text-decoration-line CSS property sets the kind of decoration that is used on text in an element, such as an underline or overline.
57
79
36
12.1
57
12.2
CSS property
line-through
57
79
6
8
57
8
none
57
79
6
8
57
8
overline
57
79
6
8
57
8
underline
57
79
6
8
57
8
Other
css.properties.text-decoration-style

The text-decoration-style CSS property sets the style of the lines specified by . The style applies to all lines that are set with text-decoration-line.
57
79
36
12.1
57
12.2
CSS property
wavy
57
79
6
8
57
8
Other
css.properties.text-decoration-thickness

The text-decoration-thickness CSS property sets the stroke thickness of the decoration line that is used on text in an element, such as a line-through, underline, or overline.
89
89
70
12.1
89
12.2
CSS property
auto
87
87
70
12.1
87
12.2
from-font
87
87
70
12.1
87
12.2
percentage

percentage values
87
87
74
17.4
87
17.4
includes color-and-style

`text-decoration-color` and `text-decoration-style` included in shorthand
57
79
6
26.2
57
26.2
includes thickness

`text-decoration-thickness` included in shorthand
87
87
70
26.2
87
26.2
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (39)
Compatibility
  • Available with a vendor prefix: -moz- (6)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (8)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (8)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (39)
Compatibility
  • Available with a vendor prefix: -moz- (6)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (8)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (8)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (39)
Compatibility
  • Available with a vendor prefix: -moz- (6)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (8)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (8)
Notes 3 item(s)
Limitation
  • This browser only partially implements this feature
Removed
  • This feature was removed in a later browser version (89)
Implementation note
  • The `text-decoration-thickness` property has no effect unless `text-underline-offset`, `text-decoration-color`, or `text-decoration-style` are set to a non-initial value. See bug 40734940.
Notes 3 item(s)
Limitation
  • This browser only partially implements this feature
Removed
  • This feature was removed in a later browser version (89)
Implementation note
  • The `text-decoration-thickness` property has no effect unless `text-underline-offset`, `text-decoration-color`, or `text-decoration-style` are set to a non-initial value. See bug 40734940.
Notes 3 item(s)
Limitation
  • This browser only partially implements this feature
Removed
  • This feature was removed in a later browser version (89)
Implementation note
  • The `text-decoration-thickness` property has no effect unless `text-underline-offset`, `text-decoration-color`, or `text-decoration-style` are set to a non-initial value. See bug 40734940.
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (8)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (8)

Syntax

CSS 
/* text-decoration */
/* See MDN Web Docs for details */

Use cases

  • Browser-native behavior

    Use text-decoration to rely on the platform for behavior that would otherwise require extra code or CSS complexity.

  • Progressive enhancement

    Enhance the experience where support exists while keeping a solid baseline elsewhere.

Cautions

  • Check browser support and actual product need before adding a new platform feature widely.
  • Keep feature usage understandable so future contributors know why it was chosen.

Accessibility

  • New platform features should still preserve readable defaults and robust interaction patterns.
  • Verify that enhancement paths do not leave unsupported environments with a broken experience.

Related links

Powered by web-features