Button by Rodrypaladin
#e8e8e8
1.button { 2 padding: 10px 20px; 3 font-size: 1.1rem; 4 background-color: rgb(243, 119, 69); 5 border: none; 6 color: white; 7 position: relative; 8 width: 120px; 9 height: 45px; 10 transition: background-color 0.2s ease-in, all 0.15s ease-in; 11} 12 13button::after { 14 display: flex; 15 align-items: center; 16 justify-content: center; 17 content: "Button"; 18 width: 120px; 19 height: 45px; 20 position: absolute; 21 top: 0; 22 left: 0; 23 transform: translate(5px, 5px); 24 background-color: white; 25 border: 2px solid rgb(224, 64, 0); 26 color: rgb(224, 64, 0); 27 transition: all 0.15s ease-in; 28} 29 30button:hover::after { 31 transform: translate(-8px, -9px); 32} 33 34button:hover { 35 transform: translate(5px, 5px); 36} 37 38button:active::after { 39 background-color: rgb(255, 218, 203); 40}
254 views
Variation of abutton
MIT License