Button by vinodjangid07
#e8e8e8
1.signupBtn { 2 width: 120px; 3 height: 40px; 4 border-radius: 30px; 5 border: none; 6 display: flex; 7 align-items: center; 8 justify-content: flex-start; 9 padding-left: 20px; 10 gap: 9px; 11 color: white; 12 background: linear-gradient(to right,rgb(128, 128, 255),rgb(183, 128, 255)); 13 position: relative; 14 cursor: pointer; 15 box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.212); 16} 17 18.arrow { 19 position: absolute; 20 right: 7.5px; 21 background-color: rgb(255, 255, 255); 22 width: 25px; 23 height: 25px; 24 display: flex; 25 align-items: center; 26 justify-content: center; 27 border-radius: 50%; 28} 29 30.signupBtn:hover .arrow { 31 animation: slide-in-left 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; 32} 33 34@keyframes slide-in-left { 35 0% { 36 transform: translateX(-10px); 37 opacity: 0; 38 } 39 40 100% { 41 transform: translateX(0); 42 opacity: 1; 43 } 44}
1.6K views
1.6K views
Variations
1 MIT License