Button by vikiWayne
#e8e8e8
1.button { 2 padding: 1em 2em; 3 border: none; 4 border-radius: 5px; 5 font-weight: bold; 6 letter-spacing: 5px; 7 text-transform: uppercase; 8 cursor: pointer; 9 color: #2c9caf; 10 transition: all 1000ms; 11 font-size: 15px; 12 position: relative; 13 overflow: hidden; 14 outline: 2px solid #2c9caf; 15} 16 17button:hover { 18 color: #ffffff; 19 transform: scale(1.1); 20 outline: 2px solid #70bdca; 21 box-shadow: 4px 5px 17px -4px #268391; 22} 23 24button::before { 25 content: ""; 26 position: absolute; 27 left: -50px; 28 top: 0; 29 width: 0; 30 height: 100%; 31 background-color: #2c9caf; 32 transform: skewX(45deg); 33 z-index: -1; 34 transition: width 1000ms; 35} 36 37button:hover::before { 38 width: 250%; 39} 40
15K views
15K views
Agboola12 15. November 2023. at 8:52
15. November 2023. at 8:52
Good work, thank you for making this useful for us
tamakachi 29. July 2023. at 13:59
29. July 2023. at 13:59
This is great, thank you
Variations
1 MIT License