Home » CSS Text Shadow

CSS Text Shadow

by Online Tutorials Library

CSS Text-shadow

As its name implies, this CSS property adds shadows to the text. It accepts the comma-separated list of shadows that applied to the text. It’s default property is none. It applies one or more than one text-shadow effect on the element’s text content.

Let’s see the syntax of text-shadow property.

Syntax

Values

h-shadow: It is the required value. It specifies the position of the horizontal shadow and allows negative values.

v-shadow: It is also the required value that specifies the position of the vertical shadow. It does not allow negative values.

blur-radius: It is the blur-radius, which is an optional value. Its default value is 0.

color: It is the color of the shadow and also an optional value.

none: It is the default value, which means no shadow.

initial: It is used to set the property to its default value.

inherit: It simply inherits the property from its parent element.

Let’s understand it by using some illustrations.

Example- Simple shadow

Test it Now

Example- Fuzzy shadow

Test it Now

Example- Multiple Shadows

Test it Now

Example- Glow Effect

Test it Now


Next TopicCSS text-transform

You may also like