-webkit-text-stroke-width
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017.
The-webkit-text-stroke-widthCSS property specifies the width of the stroke for text.
Syntax
css
/* 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: revert;-webkit-text-stroke-width: revert-layer;-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
-webkit-text-stroke-width =
<line-width>
<line-width> =
<length [0,∞]>|
thin|
medium|
thick
Examples
Varying stroke widths
CSS
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
html
<p>Thin stroke</p><p>Medium stroke</p><p>Thick stroke</p>Results
Specifications
| Specification |
|---|
| Compatibility # the-webkit-text-stroke-width |
Browser compatibility
Loading…