Degradado de texto

Hoy en día puedes ver buenos trucos como el degradado de texto en muchos lugares... ¿pero? ¿Alguna vez te has preguntado cómo se hacen? Déjame enseñarte hoy.

.text-gradient {
  background: linear-gradient(-25deg, #5662f6 0%, #7fffd4 100%);
  color: transparent;
  background-clip: text;
}

Mira aquí primero, le hemos dado un degradado al fondo del texto. Luego haremos el color del texto TRANSPARENTE para que no sea visible.
Después de eso usaremos la propiedad background-clip para hacer el texto de modo que el color del fondo cambie al color del texto.

Si quieres conocer 4 trucos más de este tipo, haz clic en la imagen a continuación.