text-decorationBaseline · Widely available
The text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
Supported in all major browsers for at least 30 months — safe to use without fallbacks. Baseline since Jul 29, 2015. Widely available since Jan 29, 2018.
Browser support
DesktopChrome
1+Supportedsince Dec 11, 2008
Current: 155Edge
12+Supportedsince Jul 29, 2015
Current: 154Firefox
1+Supportedsince Nov 9, 2004
Current: 157Safari
1+Supportedsince Jun 23, 2003
Current: 27MobileChrome Android
18+Supportedsince Jun 27, 2012
Current: 155Firefox Android
4+Supportedsince Mar 29, 2011
Current: 157Safari iOS
1+Supportedsince Jun 29, 2007
Current: 27How to use
This feature is Baseline widely available — use it freely, no fallback needed.
Example
Full syntax and examples are on MDN: text-decoration.
Feature detection
CSS · check before using
@supports (text-decoration: initial) {
/* styles that rely on text-decoration */
}
/* or in JavaScript */
if (CSS.supports("text-decoration", "initial")) {
// use it
}Sub-features
Support for each part of the feature (23). The overall table above shows when the whole feature works.
| Sub-feature | Chrome | Edge | Firefox | Safari | Chrome Android | Firefox Android | Safari iOS |
|---|---|---|---|---|---|---|---|
| text-decoration | 1 | 12 | 1 | 1 | 18 | 4 | 1 |
| text-decoration-color | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-color.currentColor | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-color.transparent | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-line | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-line.line-through | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-line.none | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-line.overline | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-line.underline | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-style | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-style.wavy | 57 | 79 | 36 | 12.1 | 57 | 36 | 12.2 |
| text-decoration-thickness | 89 | 89 | 70 | 12.1 | 89 | 79 | 12.2 |
| text-decoration-thickness.auto | 89 | 89 | 70 | 12.1 | 89 | 79 | 12.2 |
| text-decoration-thickness.from-font | 89 | 89 | 70 | 12.1 | 89 | 79 | 12.2 |
| text-decoration-thickness.percentage | 89 | 89 | 74 | 17.4 | 89 | 79 | 17.4 |
| text-decoration.currentColor | 57 | 79 | ≤50 | 26.2 | 57 | ≤50 | 26.2 |
| text-decoration.includes_color-and-style | 57 | 79 | 6 | 26.2 | 57 | 6 | 26.2 |
| text-decoration.includes_thickness | 87 | 87 | 70 | 26.2 | 87 | 79 | 26.2 |
| text-decoration.line-through | 1 | 12 | 3 | 1 | 18 | 4 | 1 |
| text-decoration.none | 1 | 12 | 3 | 1 | 18 | 4 | 1 |
Show 3 more
| Sub-feature | Chrome | Edge | Firefox | Safari | Chrome Android | Firefox Android | Safari iOS |
|---|---|---|---|---|---|---|---|
| text-decoration.overline | 1 | 12 | 3 | 1 | 18 | 4 | 1 |
| text-decoration.transparent | 57 | 79 | ≤50 | 26.2 | 57 | ≤50 | 26.2 |
| text-decoration.underline | 1 | 12 | 3 | 1 | 18 | 4 | 1 |