Button by AqFox
#e8e8e8
1.custom-btn { 2 width: 130px; 3 height: 40px; 4 color: #fff; 5 border-radius: 5px; 6 padding: 10px 25px; 7 font-family: 'Lato', sans-serif; 8 font-weight: 500; 9 background: transparent; 10 cursor: pointer; 11 transition: all 0.3s ease; 12 position: relative; 13 display: inline-block; 14 box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5), 15 7px 7px 20px 0px rgba(0,0,0,.1), 16 4px 4px 5px 0px rgba(0,0,0,.1); 17 outline: none; 18 font-size: 15px; 19} 20 21.btn-2 { 22 background: #004dff; 23 background: linear-gradient(0deg, #004dff 0%, #004dff 100%); 24 border: none; 25} 26 27.btn-2:before { 28 height: 0%; 29 width: 2px; 30} 31 32.btn-2:hover { 33 box-shadow: 4px 4px 6px 0 rgba(255,255,255,.5), 34 -4px -4px 6px 0 rgba(116, 125, 136, .5), 35 inset -4px -4px 6px 0 rgba(255,255,255,.2), 36 inset 4px 4px 6px 0 rgba(0, 0, 0, .4); 37} 38
6K views
6K views
Variations
1 MIT License