Text Decoration Thickness

Set the thickness of decorative lines on text.

This feature is well established and works across many devices and browser versions.

Chrome

Edge

Firefox

Safari

tdt-0

text-decoration-thickness: 0;

tdt-1

text-decoration-thickness: 1px;

tdt-2

text-decoration-thickness: 2px;

tdt-3

text-decoration-thickness: 3px;

tdt-4

text-decoration-thickness: 4px;

tdt-auto

text-decoration-thickness: auto;

tdt-ff

text-decoration-thickness: from-font;

Prefix a class with a breakpoint to apply it from that width up.

Prefix a class with a state to apply it only while that state matches.