Button by ozgeozkaraa01
#e8e8e8
1.btn { 2 display: grid; 3 place-items: center; 4 background-color: #e2e8f0; 5 padding: 1.5em; 6 border-radius: 10px; 7 box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15), 8 -6px -6px 10px -1px rgba(255,255,255,0.7); 9 border: none; 10 cursor: pointer; 11 transition: transform 0.5s; 12} 13 14.btn:hover { 15 box-shadow: inset 4px 4px 6px -1px rgba(0,0,0,0.2), 16 inset -4px -4px 6px -1px rgba(255,255,255,0.7), 17 -0.5px -0.5px 0px rgba(255,255,255,1), 18 0.5px 0.5px 0px rgba(0,0,0,0.15), 19 0px 12px 10px -10px rgba(0,0,0,0.05); 20 border: 1px solid rgba(0,0,0,0.1); 21 transform: translateY(0.5em); 22} 23 24.btn svg { 25 transition: transform 0.6s; 26} 27 28.btn:hover svg { 29 transform: scale(0.9); 30} 31 32
705 views
705 views
MIT License