Button by Rodrypaladin
#e8e8e8
1.button { 2 font-size: 2em; 3 padding: 10px 20px; 4 background-color: transparent; 5 transition: all 0.2s ease-out; 6 border: none; 7} 8 9.button__span { 10 color: #131313; 11 transition: all 0.2s ease-out; 12 background-color: #e7e5e4; 13 letter-spacing: .15em; 14 text-shadow: 1px -1px 0 #767676, 15 -1px 2px 1px #737272, 16 -2px 4px 1px #767474, 17 -3px 6px 1px #787777, 18 -4px 8px 1px #7b7a7a, 19 -5px 10px 1px #7f7d7d, 20 -6px 12px 1px #828181, 21 -7px 14px 1px #868585, 22 -8px 16px 1px #8b8a89, 23 -9px 18px 1px #8f8e8d, 24 -10px 20px 1px #949392, 25 -11px 22px 1px #999897, 26 -12px 24px 1px #9e9c9c, 27 -13px 26px 1px #a3a1a1, 28 -14px 28px 1px #a8a6a6, 29 -15px 30px 1px #adabab, 30 -16px 32px 1px #b2b1b0, 31 -17px 34px 1px #b7b6b5, 32 -18px 36px 1px #bcbbba, 33 -19px 38px 1px #c1bfbf, 34 -20px 40px 1px #c6c4c4, 35 -21px 42px 1px #cbc9c8, 36 -22px 44px 1px #cfcdcd, 37 -23px 46px 1px #d4d2d1, 38 -24px 48px 1px #d8d6d5, 39 -25px 50px 1px #dbdad9, 40 -26px 52px 1px #dfdddc, 41 -27px 54px 1px #e2e0df, 42 -28px 56px 1px #e4e3e2; 43} 44 45.button__span:hover { 46 text-shadow: -1px -1px 0 #767676, 47 1px 2px 1px #737272, 48 2px 4px 1px #767474, 49 3px 6px 1px #787777, 50 4px 8px 1px #7b7a7a, 51 5px 10px 1px #7f7d7d, 52 6px 12px 1px #828181, 53 7px 14px 1px #868585, 54 8px 16px 1px #8b8a89, 55 9px 18px 1px #8f8e8d, 56 10px 20px 1px #949392, 57 11px 22px 1px #999897, 58 12px 24px 1px #9e9c9c, 59 13px 26px 1px #a3a1a1, 60 14px 28px 1px #a8a6a6, 61 15px 30px 1px #adabab, 62 16px 32px 1px #b2b1b0, 63 17px 34px 1px #b7b6b5, 64 18px 36px 1px #bcbbba, 65 19px 38px 1px #c1bfbf, 66 20px 40px 1px #c6c4c4, 67 21px 42px 1px #cbc9c8, 68 22px 44px 1px #cfcdcd, 69 23px 46px 1px #d4d2d1, 70 24px 48px 1px #d8d6d5, 71 25px 50px 1px #dbdad9, 72 26px 52px 1px #dfdddc, 73 27px 54px 1px #e2e0df, 74 28px 56px 1px #e4e3e2; 75} 76 77.button:active .button__span { 78 text-shadow: none; 79}
466 views
466 views
MIT License