Button by omriluz
#e8e8e8
1button { 2 background: linear-gradient(245deg, #000000 0%, #fdff96 100%), 3 linear-gradient(245deg, #0038ff 0%, #000000 100%), 4 radial-gradient(100% 225% at 100% 0%, #4200ff 0%, #001169 100%), 5 linear-gradient(245deg, #000000 0%, #ffb800 100%), 6 radial-gradient( 7 115% 107% at 40% 100%, 8 #eaf5ff 0%, 9 #eaf5ff 40%, 10 #a9c6de calc(40% + 1px), 11 #a9c6de 70%, 12 #247e6c calc(70% + 2px), 13 #247e6c 85%, 14 #e4c666 calc(85% + 2px), 15 #e4c666 100% 16 ), 17 linear-gradient( 18 65deg, 19 #083836 0%, 20 #083836 40%, 21 #66d37e calc(40% + 1px), 22 #66d37e 60%, 23 #c6e872 calc(60% + 1px), 24 #c6e872 100% 25 ); 26 background-blend-mode: overlay, screen, overlay, hard-light, overlay, normal; 27 font-family: inherit; 28 padding: 0.6em 1.3em; 29 font-weight: 900; 30 font-size: 18px; 31 border: 3px solid black; 32 border-radius: 0.4em; 33 box-shadow: 0.1em 0.1em; 34} 35 36button > span { 37 color: white; 38} 39 40button:hover { 41 transform: translate(-0.05em, -0.05em); 42 box-shadow: 0.15em 0.15em; 43} 44 45button:active { 46 transform: translate(0.05em, 0.05em); 47 box-shadow: 0.05em 0.05em; 48} 49
261 views
Variation of abutton
MIT License