CSS text-stroke-color Property

The text-stroke-color property specifies the color of the character’s storke. The default value of the text-stroke-color is the default value of the color property.

You can choose colors from here HTML colors.

The text-stroke-color property is only used with a -webkit- vendor prefix.
Initial Value currentColor
Applies to All elements.
Inherited Yes.
Animatable Yes. The color is animatable.
Version Compatibility Standard
DOM Syntax object.style.textStrokeColor = "#8ebf42";

Syntax

text-stroke-color: color | initial | inheirt;

Example of the text-stroke-color property:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      p {
        margin: 0;
        font-size: 3em;
        -webkit-text-stroke-width: 2px;
        -webkit-text-stroke-color: #8ebf42;
      }
    </style>
  </head>
  <body>
    <h2>Text-stroke-color property example</h2>
    <p>Lorem Ipsum is simply dummy text...</p>
    <input type="color" value="#8ebf42">
  </body>
</html>

Result

SS text-stroke-color values list

Values

Value Description
color Specifies the color of the stroke. Color names, hexadecimal color codes, rgb(), rgba(), hsl(), hsla() can be used.
initial Makes the property use its default value.
inherit Inherits the property from its parents element.

Browser support

chrome edge firefox safari opera
1.0+ 15.0+ 49.0+ 15.0+

Practice Your Knowledge

The default value of the text-stroke-color is the default value of the

Quiz Time: Test Your Skills!

Ready to challenge what you've learned? Dive into our interactive quizzes for a deeper understanding and a fun way to reinforce your knowledge.

Do you find this helpful?