Как создать градиент для текста в HTML с поддержкой браузерами Webkit?

Чтобы создать градиент для текста в HTML с поддержкой браузеров Webkit, нужно: webdevtips.pro www.geeksforgeeks.org

1. Применить базовый фон к тегу body и выровнять текст по центру страницы. www.geeksforgeeks.org
2. Сделать несколько базовых стилизаций, например, установить размер шрифта и семейство. www.geeksforgeeks.org
3. Применить свойство линейного градиента к любым цветам по выбору. www.geeksforgeeks.org
4. Применить свойства Webkit: первое сделает весь градиентный фон прозрачным, а второе заполнит текст градиентным фоном. www.geeksforgeeks.org

Пример кода: tproger.ru

h1 {   font-family: Roboto, Arial, sans-serif;   font-size: 10vmax;   background-color: #2AA5A0;   background-image: linear-gradient(90deg, #E3535D, #2AA5A0);   -webkit-background-clip: text;   -webkit-text-fill-color: transparent; } 

Свойство -webkit-background-clip: text оставляет градиент только под текстом, а -webkit-text-fill-color: transparent делает цвет текста прозрачным. tproger.ru

Пользоваться свойством -webkit-text-fill-color нужно с осторожностью, так как это нестандартное свойство, поведение которого может измениться в будущем. tproger.ru