Button by sahilxkhadka
#e8e8e8
1button { 2 all: unset; 3 position: relative; 4 height: 4em; 5 width: 10em; 6 padding: 8px 24px; 7 border-radius: 10px; 8 background: linear-gradient(180deg, #282828, #202020); 9 box-shadow: inset -8px 0 8px rgba(0, 0, 0, 0.15), 10 inset 0 -8px 8px rgba(0, 0, 0, 0.25), 11 0 0 0 2px rgba(0, 0, 0, 0.75), 12 10px 20px 25px rgba(0, 0, 0, 0.4); 13 display: flex; 14 justify-content: center; 15 align-items: center; 16 cursor: pointer; 17} 18 19button::before { 20 content: ""; 21 position: absolute; 22 top: 3px; 23 left: 4px; 24 bottom: 14px; 25 right: 12px; 26 background: linear-gradient(90deg, #232323, #4a4a4a); 27 border-radius: 10px; 28 box-shadow: -10px -10px 10px rgba(255, 255, 255, 0.25), 29 10px 5px 10px rgba(0, 0, 0, 0.15); 30 border-left: 1px solid #0004; 31 border-bottom: 1px solid #0004; 32 border-top: 1px solid #0009; 33} 34 35button span { 36 font-size: 1.5rem; 37 color: white; 38 position: relative; 39 margin-top: -8px; 40}
821 views
821 views
MIT License