Use shadows to create depth, hierarchy and readability without pushing the UI into muddy, overdesigned territory.
Offset, blur, spread and color define the perceived depth of a box.
The common pattern is `box-shadow: offset-x offset-y blur spread color`. Horizontal and vertical offsets place the shadow, blur softens it, spread grows or shrinks it, and color defines the tone.
You can also combine several shadows in one declaration. That is often how modern interfaces create softer, more realistic elevation.
Text shadows are most useful when they support readability, not when they become a gimmick.
`text-shadow` follows a similar structure: horizontal offset, vertical offset, blur and color. It works especially well for headings on photographs or dark gradients.
For long body text, use it very carefully. Readability usually improves more through contrast and spacing than through decorative shadow effects.