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-color CSS property specifies the stroke color of characters of text. If this property is not set, the value of the color property is used.
/* <color> values */ -webkit-text-stroke-color: red; -webkit-text-stroke-color: #e08ab4; -webkit-text-stroke-color: rgb(200 100 0); /* Global values */ -webkit-text-stroke-color: inherit; -webkit-text-stroke-color: initial; -webkit-text-stroke-color: revert; -webkit-text-stroke-color: revert-layer; -webkit-text-stroke-color: unset;
<color>The color of the stroke.
| Initial value | currentcolor |
|---|---|
| Applies to | all elements |
| Inherited | yes |
| Computed value | computed color |
| Animation type | a color |
-webkit-text-stroke-color =
<color>
<p>Text with stroke</p> <input type="color" value="#ff0000" />
p {
margin: 0;
font-size: 4em;
-webkit-text-stroke-width: 3px;
-webkit-text-stroke-color: red; /* Can be changed in the live sample */
}
| Specification |
|---|
| Compatibility> # the-webkit-text-stroke-color> |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
-webkit-text-stroke-color |
1 | 15 | 49 | 15 | 3 | 18 | 49 | 15 | 2 | 1.0 | 37 | 2 |
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-stroke-color