Button by cosnametv
#e8e8e8
1.button { 2 height: 50px; 3 width: 150px; 4 border: none; 5 border-radius: 10px; 6 cursor: pointer; 7 position: relative; 8 overflow: hidden; 9 transition: all 0.5s ease-in-out; 10} 11 12.button:hover { 13 box-shadow: .5px .5px 150px #252525; 14} 15 16.type1::after { 17 content: "THANK YOU"; 18 height: 50px; 19 width: 150px; 20 background-color: #4617ec; 21 color: #fff; 22 transform: translateY(100px); 23 font-size: 1.2rem; 24 font-weight: 700; 25 display: flex; 26 align-items: center; 27 justify-content: center; 28 transition: 0.5s; 29} 30 31.type1::before { 32 content: "SUBSCRIBE"; 33 height: 50px; 34 width: 150px; 35 background-color: rgb(240, 9, 9); 36 color: #f5f8f8; 37 position: absolute; 38 transform: translateY(0px) scale(1.1); 39 font-size: 1.2rem; 40 font-weight: 900; 41 display: flex; 42 align-items: center; 43 justify-content: center; 44 transition: 0.5s; 45} 46 47.type1:hover::after { 48 transform: translateY(-2px) scale(1.2) rotate(0deg); 49} 50 51.type1:hover::before { 52 transform: translateY(-50px) rotate(290deg); 53}
467 views
467 views
MIT License