👉Just copy this css and this html in your html file and run in your browser


<html>

<style>

.top-spong-heading {

font-weight: 600;

  /* Fallback: Set a background color. */

  background-color: #CA4246;

  

  background-image: linear-gradient( 

45deg

 , #7abf18 16.666%, #E16541 16.666%, #E16541 33.333%, #F18F43 33.333%, #F18F43 50%, #8B9862 50%, #8B9862 66.666%, #7abf18d6 66.666%, #7abf18 83.333%, #A7489B 83.333%);

  

  /* Set the background size and repeat properties. */

  background-size: 100%;

  background-repeat: repeat;


  /* Use the text as a mask for the background. */

  /* This will show the gradient as a text color rather than element bg. */

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent; 

  

  /* Animate the text when loading the element. */

    /* This animates it on page load and when hovering out. */

    animation: rainbow-text-simple-animation-rev 0.75s ease forwards;


}


.top-spong-heading:hover{

    animation: rainbow-text-simple-animation 0.5s ease-in forwards;

}



/* Move the background and make it smaller. */

/* Animation shown when entering the page and after the hover animation. */

@keyframes rainbow-text-simple-animation-rev {

    0% {

        background-size: 650%;

    }

    40% {

        background-size: 650%;

    }

    100% {

        background-size: 100%;

    }

}


/* Move the background and make it larger. */

/* Animation shown when hovering over the text. */

@keyframes rainbow-text-simple-animation {

    0% {

        background-size: 100%;

    }

    80% {

        background-size: 650%;

    }

    100% {

        background-size: 650%;

    }

}


</style>

<body>

<h3 class="top-spong-heading">Spong Enterprice pvt. Limited</h3 >

</body>

</html>

<h3 class="top-spong-heading">Annu Upadhyay</h3 >