CSS Text Shadow

The text-shadow property adds shadow to text.

In its simplest use, you only specify the horizontal and the vertical shadow.

In addition, you can add a shadow color and blur effect.

Horizontal and vertical shadow:

h1 {

text-shadow: 2px 2px;

}

Horizontal and vertical shadow, with color:

h1 {

text-shadow: 2px 2px red;

}

Horizontal and vertical shadow, with color and blur effect:

h1 {

text-shadow: 2px 2px 5px red;

}

Multiple Shadows

The text-shadow property also accepts multiple shadows for an element. Define each shadow in a comma-separated list.

The following example shows a red and blue neon glow shadow:

Text-shadow with red and blue neon glow:

h1 {

text-shadow: 0 0 3px #ff0000, 0 0 5px #0000ff;

}