Text-Shadow
Creating shadows around text is fairly simple in CSS. The most difficult part is remembering the sequence of values: to right, down, blur, color. Negative values for the first two items will move the shadow left and up.
The keyword none will remove text-shadow as needed.
CSS .text1 {text-shadow: 5px 5px 5px red;}
Multiple text shadows can easily be added for interesting effects. Simply include two or more sets of values, separated by a comma.
CSS .text1 {text-shadow: 5px 5px 5px red, -5px -5px 5px blue;
Box-Shadow
A box shadow simply creates a shadow around an entire element. The basic syntax is the same as used with text-shadow, although there are a few variations.
Basic Box-Shadow
CSS .box {box-shadow: 10px 10px 5px grey;}
Inset Box-Shadow
In this case, the shadow will be inside the box.
CSS .box {box-shadow: inset 10px 10px 5px grey;}
Multiple Box-Shadows
Use the same approach used to create multiple text-shadows: separate sets of values with a comma.
CSS .box {box-shadow: -10px -10px 5px grey, 10px 10px 5px black;}
Multiple box-shadows are often used in neomorphism.
