Как добавить тень в css

Для добавления тени в CSS используйте свойство box-shadow. Его значение представляет собой последовательность из нескольких параметров, разделенных пробелами:

box-shadow: горизонтальное_смещение вертикальное_смещение размытие цвет;

• горизонтальное_смещение задает смещение тени вправо или влево от элемента (положительное значение — вправо, отрицательное — влево);
• вертикальное_смещение задает смещение тени вниз или вверх от элемента (положительное значение — вниз, отрицательное — вверх);
• размытие задает степень размытия тени (чем больше значение, тем более размытой будет тень);
• цвет задает цвет тени (можно использовать названия цветов на английском языке или шестнадцатеричные коды цветов).

Пример:

.box {
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

В этом примере свойство box-shadow задает тень для элемента с классом .box. Тень будет иметь горизонтальное смещение 2 пикселя, вертикальное смещение 2 пикселя, степень размытия 4 пикселя и цвет тени — полупрозрачный черный ( rgba(0, 0, 0, 0.3) — это цвет в формате RGBA, где последнее значение задает прозрачность).