Button by ozgeozkaraa01
#e8e8e8
1button { 2 border: none; 3 padding: 0.8em 2.5em; 4 outline: none; 5 color: white; 6 font-style: 1.2em; 7 position: relative; 8 z-index: 1; 9 cursor: pointer; 10 background: none; 11 text-shadow: 3px 3px 10px rgba(0, 0, 0, 0.45); 12} 13 14button::before, 15button::after { 16 position: absolute; 17 top: 50%; 18 left: 50%; 19 border-radius: 10em; 20 -webkit-transform: translateX(-50%) translateY(-50%); 21 transform: translateX(-50%) translateY(-50%); 22 width: 105%; 23 height: 105%; 24 content: ""; 25 z-index: -2; 26 background-size: 400% 400%; 27 background: linear-gradient( 28 100deg, 29 #f79533, 30 #f37055, 31 #ef4e7b, 32 #a166ab, 33 #5073b8, 34 #1098ad, 35 #07b39b, 36 #6fba82 37 ); 38} 39 40button::before { 41 -webkit-filter: blur(7px); 42 filter: blur(7px); 43 -webkit-transition: all 0.25s ease; 44 transition: all 0.25s ease; 45 -webkit-animation: pulse 10s infinite ease; 46 animation: pulse 10s infinite ease; 47} 48 49button::after { 50 -webkit-filter: blur(0.3px); 51 filter: blur(0.3px); 52} 53 54button:hover::before { 55 width: 115%; 56 height: 115%; 57}
674 views
674 views
MIT License