Button by aboalsim114
#212121
1button { 2 position: relative; 3 background-color: rgb(230, 34, 77); 4 border-radius: 5px; 5 box-shadow: rgb(121, 18, 55) 0px 4px 0px 0px; 6 padding: 15px; 7 background-repeat: no-repeat; 8 cursor: pointer; 9 box-sizing: border-box; 10 width: 154px; 11 height: 49px; 12 color: #fff; 13 border: none; 14 font-size: 20px; 15 transition: all 0.3s ease-in-out; 16 z-index: 1; 17 overflow: hidden; 18} 19 20button::before { 21 content: ""; 22 background-color: rgb(248, 50, 93); 23 width: 0; 24 height: 100%; 25 position: absolute; 26 top: 0; 27 left: 0; 28 z-index: -1; 29 transition: width 700ms ease-in-out; 30 display: inline-block; 31} 32 33button:hover::before { 34 width: 100%; 35} 36
9.5K views
9.5K views
MIT License