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

Аватар пользователя Кирилл Маркеев
Кирилл Маркеев
17 октября 2022

Для добавления тени к тексту можно воспользоваться CSS свойством text-shadow.

Тень описывается её смещением по осям X и Y относительно текста, радиусом размытия и цветом.

Рассмотрим на конкретном примере: предположим, у нас на странице есть заголовок первого уровня, для которого заданы следующие CSS свойства:

h1 {
  text-shadow: 3px -4px 5px red;
}

В результате у заголовка мы получим тень красного цвета, которая относительно текста будет смещена по оси X на 3 пикселя вправо (так как значение положительно), по оси Y на 4 пикселя вверх (так как значение отрицательно), а радиус размытия тени будет составлять 5 пикселей.

1 0