Блог
2024-02-23 18:29

Анимированный градиент на заголовке

На одном из прошлых проектов мне необходимо было реализовать название компании так, чтобы это вписывалось в концепт общего минималистичного дизайна, но при этом заголовок должен был выделяться. Я перебрала несколько вариантов, но ни один из них не подходил идеально и тогда пришло озарение, так сказать, а почему бы не сделать анимированный градиентный заголовок?! Может быть это решение уже не ново, но как по мне, до сих пор достойно внимания.
Итак, давайте приступим к реализации данного градиента.
Создаем ZeroBlock. В моем случае я делала градиент на главной странице для обложки.
Добавляем текст и через правую кнопку мыши придаем ему css class "gradient" или любой другой, какой вам захочется.
Далее добавляем HTML код
Открываем это окно и прописываем следующий код:
{$co}
Цвет градиента можно менять само собой, я советую поиграться с параметрами background. Мне нравится подбирать градиент через вот этот сайт.
Если остались вопросы, пишите)