![](/build/_assets/logo-png-XGWSYHKJ.png)
Button by Github-Suriya
#e8e8e8
1button { 2 font-family: inherit; 3 font-size: 20px; 4 background: #eef0ee; 5 padding: 0.3em; 6 border: none; 7 border-radius: 15px; 8 overflow: hidden; 9 transition: all 0.2s; 10 cursor: pointer; 11 box-shadow: 0px 0px 6px #c5c5c5; 12} 13 14button span { 15 display: block; 16 margin-left: 0.3em; 17 font-weight: 600; 18 transition: all 0.3s ease-in-out; 19} 20 21button svg { 22 display: block; 23 transform-origin: center center; 24 transition: transform 0.3s ease-in-out; 25} 26 27button .svg-name-con { 28 background: #fcfdfc; 29 border-radius: 25px; 30 display: flex; 31 align-items: center; 32 padding: 0.7em 1em; 33} 34 35button:hover .svg-wrapper { 36 animation: fly-1 0.6s ease-in-out infinite alternate; 37} 38 39button:hover svg { 40 transform: translateX(4.2em) rotate(45deg) scale(1.1); 41} 42 43button:hover span { 44 transform: translateX(9em); 45} 46 47button:active { 48 transform: scale(0.95); 49} 50 51@keyframes fly-1 { 52 from { 53 transform: translateY(0.1em); 54 } 55 56 to { 57 transform: translateY(-0.1em); 58 } 59} 60
42 views
42 views
MIT License