gradient-text (_base.scscs)

Tipo: Mixin

Versión: 2.x.x

Aplica un gradiente al texto a partir de los argumentos que recibe linear-gradient. El mixin no espera la función completa, solo la lista de valores que se le pasarán internamente.

Además aplica background-clip: text, text-fill-color: transparent y permite definir display, cuyo valor por defecto es inline-block, para que el gradiente se vea correctamente sobre el contenido del texto.

Interface 

@mixin gradient-text($grad, $display: inline-block);

Parámetros secuenciales

Parámetro Tipo Default Descripción
grad String | List Sin default Define los argumentos que se envían a linear-gradient para generar background-image.
display String inline-block Define la propiedad display aplicada al elemento con el texto degradado.

Ejemplo

Texto gradiente 

            


            

                

            


            

                
<span class="gradient_text_example">Texto gradiente</span>