CSS Shadow Effects

---

CSS Shadow Effects

With CSS you can add shadow to text and to elements.

In these chapters you will learn about the following properties:

text-shadow
box-shadow

---

CSS Text Shadow

The CSS text-shadow property applies shadow to text.

In its simplest use, you only specify the horizontal shadow (2px) and the vertical shadow (2px).

Output :

Then, add a blur effect to the shadow:

Output :

Multiple Shadows

To add more than one shadow to the text, you can add a comma-separated list of shadows.

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

Output 3:

The following example shows a white text with black, blue, and darkblue shadow:

Output :

You can also use the text-shadow property to create a plain border around some text (without shadows): Border around text!

Output:-: