Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
The -webkit-text-stroke-width
CSS property specifies the width of the stroke for text.
Syntax
/* Keyword values */ -webkit-text-stroke-width: thin; -webkit-text-stroke-width: medium; -webkit-text-stroke-width: thick; /* <length> values */ -webkit-text-stroke-width: 2px; -webkit-text-stroke-width: 0.1em; -webkit-text-stroke-width: 1mm; -webkit-text-stroke-width: 5pt; /* Global values */ -webkit-text-stroke-width: inherit; -webkit-text-stroke-width: initial; -webkit-text-stroke-width: unset;
Values
<line-width>
- The width of the stroke.
Formal definition
Initial value | 0 |
---|---|
Applies to | all elements |
Inherited | yes |
Computed value | absolute <length> |
Animation type | discrete |
Formal syntax
<length>
Examples
Varying stroke widths
CSS
p { margin: 0; font-size: 4em; -webkit-text-stroke-color: red; } #thin { -webkit-text-stroke-width: thin; } #medium { -webkit-text-stroke-width: 3px; } #thick { -webkit-text-stroke-width: 1.5mm; }
HTML
<p id="thin">Thin stroke</p> <p id="medium">Medium stroke</p> <p id="thick">Thick stroke</p>
Results
Specifications
Specification | Status | Comment |
---|---|---|
Compatibility Standard The definition of '-webkit-text-stroke-width' in that specification. |
Living Standard | Initial standardization |
Safari CSS Reference '-webkit-text-stroke-width' in that document. |
Non-standard unofficial documentation | Initial documentation |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
-webkit-text-stroke-width | Chrome Full support 1 | Edge Full support 15 | Firefox
Full support
49
| IE No support No | Opera Full support 15 | Safari Full support 3 | WebView Android Full support 38 | Chrome Android Full support 18 | Firefox Android
Full support
49
| Opera Android Full support 15 | Safari iOS Full support 2 | Samsung Internet Android Full support 1.0 |
Legend
- Full support
- Full support
- No support
- No support
- Non-standard. Expect poor cross-browser support.
- Non-standard. Expect poor cross-browser support.
- User must explicitly enable this feature.
- User must explicitly enable this feature.