Updated: 2026-07-11
Decoration Lines
Decoration Style
Preview
The quick brown fox jumps over the lazy dog — CSS text decoration
Generated CSS Code (Longhand)
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-thickness: 2px;
text-decoration-color: #06b6d4;
text-underline-offset: 4px;
Shorthand Syntax
text-decoration: underline solid #06b6d4 2px;
Usage
CSS text-decoration properties control the appearance of text decoration lines:
• text-decoration-line — underline, overline, line-through
• text-decoration-style — solid, double, dotted, dashed, wavy
• text-decoration-thickness — line thickness in px
• text-decoration-color — line color
• text-underline-offset — distance from baseline
Shorthand: text-decoration: underline solid #06b6d4 2px;