Чтобы создать градиент для текста в HTML с поддержкой браузеров Webkit, нужно: 13
Пример кода: 2
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
делает цвет текста прозрачным. 2
Пользоваться свойством -webkit-text-fill-color
нужно с осторожностью, так как это нестандартное свойство, поведение которого может измениться в будущем. 2