<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>singhbir</title>
   
</head>
 <style>
        body{
            
            background-color: #4e504a ;
        }
     h2{
         text-align: center;
         margin: 0 auto;
         margin-top: 300px;
         color: white;
     }
    a{
        
    font-size: 2em;
    border: 2px solid black;         
    border-radius:30px;
    background: linear-gradient(90deg,#03a9f4,#f441a5,#ffeb3b,#03a9f4);
    background-size: 200%; 
    color: black;
        text-decoration: none;
     }
 a:hover{
    animation: helo 1.5s linear infinite;
        }

@keyframes helo{
    0%{
        background-position: 0% ;
        
    }
    100%{
        background-position: 200%;
    }
    
}    
    </style>
<body>
    <div>
    <h2>
        <a href="https://www.github.com/singhbir">Connect with Singh_bir</a><br>
        hover on above button
         </h2>
    </div>
</body>
</html>