Button by Bodyhc
#212121
1button { 2 position: relative; 3 border: 1px solid #725ac1; 4 outline: none; 5 background-color: transparent; 6 padding: 15px 30px; 7 border-radius: 30px; 8 z-index: 2; 9 cursor: pointer; 10 color: #ffff; 11 overflow: hidden; 12 text-align: center; 13 font-size: 20px; 14 font-weight: 800; 15 font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif; 16} 17 18button::before { 19 content: ""; 20 position: absolute; 21 top: 20%; 22 left: 20%; 23 transform: translate(-50%, -50%); 24 width: 40px; 25 height: 40px; 26 background-color: #725ac1; 27 filter: blur(5px); 28 z-index: -1; 29 transition: width 0.9s ease-out, height 0.9s ease-out, 30 background-color 0.3s ease-out; 31 border-radius: 50%; 32} 33 34button:hover::before { 35 border-radius: 20px; 36 width: 300px; 37 height: 200px; 38 background-color: #725ac1; 39} 40
421 views
421 views
MIT License