Текст с градиентом

Градиент в цвет шрифта можно добавить с помощью следующих CSS свойств:

  • color: transparent; – задает прозрачный цвет шрифта.
  • background-clip: text; – окрашивает текст в цвет или изображение указанного в background-image.
  • background-image: linear-gradient или background-image: radial-gradient – задает градиент.

Свойство background-clip: text находится в стадии разработки и поддерживается некоторыми современными браузерами только с префиксом -webkit-.

.class {
	-webkit-background-clip: text;
	background-clip: text;
}
CSS
13.09.2018, обновлено 20.09.2019 1970

Поделится

Другие публикации

Сборник CSS стилей с эффектом фильтров Инстаграма.
08.04.2018 1087
Библиотека GD дает возможность работать с изображениями в PHP. Далее представлены примеры как изменить размер, вырезать...
22.01.2018 13107
В статье представлены все самые встречающеюся мета-теги с примерами и пояснениями их использования.
17.01.2018 2635
С фоном у текста есть проблема – у элемента с display: inline при переносах текста не работают отступы (padding) по...
02.07.2019 1063
Примеры как зарегистрировать бота в Телеграм, описание и взаимодействие с основными методами API.
17.11.2018 8185
С помощью расширения dompdf можно легко сформировать PDF файл. По сути, dompdf - это конвертер HTML в PDF который...
16.02.2018 9607