Продолжим экспериментировать с различными текстовыми эффектами и создадим “огненный” текст используя возможности CSS.
Код класса:
.fire-text {
text-align: center;
margin: 200px auto;
font-size: 120px;
color: #fff;
text-shadow: 0 0 20px #fefcc9, 10px -10px 30px #feec85, -20px -20px 40px #ffae34, 20px -40px 50px #ec760c, -20px -60px 60px #cd4606, 0 -80px 70px #973716, 10px -90px 80px #451b0e;
}За эффект огня отвечает аттрибут text-shadow. Смело поэкспериментируйте с цветами, чтобы понять, за что отвечает конкретный параметр.
Демо доступно на Codepen.
Опубликовано
Подробнее