<a href="https://godofredo.ninja/css-como-realizar-un-animado-efecto-de-texto-degradado-gradient/">CSS </br> Texto con </br> Degradado</a>
body {
  background-color: #031b27;
  height: 100vh;
  display:flex;
  align-items:center;
  justify-content: center;
  font-size: 4rem;
  font-weight: bold;
  text-align: right;
}

/* Css - Texto con Degradado */
a {
  animation: fluido 10s ease-in-out infinite;
  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  background-size: 300%;
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
}

@keyframes fluido {
    0% { background-position: 0 50% }
    50% { background-position: 100% 50% }
    100% { background-position: 0 50% }
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.