Style textShadow attribute

Definition and Usage

textShadow Sets or returns one or more shadow effects for text properties.

See also:

CSS Tutorial:CSS Text Shadow

CSS Reference Manual:text-shadow attribute

Example

Example 1

Add shadow to text:

document.getElementById("myP").style.textShadow = "5px 5px 1px #ff0000, 10px 10px 1px #0000ff";

Try It Yourself

Example 2

Return text shadow:

alert(document.getElementById("myP").style.textShadow);

Try It Yourself

Syntax

Return textShadow attribute:

object.style.textShadow

Set textShadow attribute:

object.style.textShadow = "none|h-shadow v-shadow blur color|initial|inherit"

Note:The textShadow attribute adds one or more shadows to the text. The attribute is a list of shadows separated by commas, each shadow defined by 2 or 3 length values and an optional color. Omitted lengths are 0.

Attribute Value

Value Description
none Does not draw a shadow. Default.
h-shadow Required. The horizontal position of the shadow. Allows negative values.
v-shadow Required. The vertical position of the shadow. Allows negative values.
blur Optional. The blur distance.
color

Optional. The color of the shadow.

Please see CSS Color Valuesfor the complete list of possible color values.
initial Sets this property to its default value. See initial.
inherit Inherits this property from its parent element. See inherit.

Technical Details

Default Value: none
Return Value: A string representing the list of shadow effects applied to the element text, separated by commas.
CSS Version: CSS3

Browser Support

The numbers in the table indicate the first browser version to fully support this attribute.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support 10.0 Support Support Support