Ejemplo 1: Agregar el degradado a todo el texto

image.png

Paso 1: Haz clic en el Selector de CSS, pega el siguiente código y haz clic en guardar. Puedes cambiar los colores del degradado modificando los valores dentro de la función rgba(#, #, #, #) (rojo, verde, azul, transparencia).

.coolheader1 {
/*the below line creates a gradient that goes left to right line*/
    background-image: linear-gradient(to right, rgba(255, 210, 63), rgba(84, 13, 110));
    /*the below line clips the gradient to only match the text*/
    -webkit-background-clip: text !important;
    /*the below line makes the text transparent so the gradient underneath is revealed*/
    -webkit-text-fill-color: transparent !important;
}

Paso 2: Selecciona el texto al que quieres aplicar el degradado, haz clic en la pestaña Avanzado y, en el campo "Clase personalizada", escribe coolheader1. Haz clic en Guardar.

Notarás que el texto se vuelve transparente, pero cuando previsualices o publiques la página, el efecto funcionará.

image.png

Resultado Final:

image.png

Ejemplo 2: Agregar el degradado solo a caracteres/palabras que están en ‘Negrita’

image.png

Paso 1: Haz clic en el Selector de CSS, pega el siguiente código y haz clic en guardar. Puedes cambiar los colores del degradado modificando los valores dentro de la función rgba(#, #, #, #) y el ángulo del degradado (actualmente, 90deg significa que el degradado será horizontal).