#e8e8e8
1.btn { 2 text-decoration: none; 3 padding: 20px 40px; 4 font-size: 1em; 5 position: relative; 6 margin: 32px; 7 border: none; 8 background-color: #26caf8; 9 font-weight: 600; 10} 11 12.btn-1 { 13 overflow: hidden; 14 color: #fff; 15 border-radius: 30px; 16 box-shadow: 0 0 0 0 rgba(143, 64, 248, 0.5), 0 0 0 0 rgba(39, 200, 255, 0.5); 17 transition: transform 0.3s ease, box-shadow 0.3s ease; 18} 19 20.btn-1::after { 21 content: ""; 22 width: 400px; 23 height: 400px; 24 position: absolute; 25 top: -50px; 26 left: -100px; 27 background-color: #ff3cac; 28 background-image: linear-gradient(225deg, #27d86c 0%, #26caf8 50%, #c625d0 100%); 29 z-index: -1; 30 transition: transform 0.5s ease; 31} 32 33.btn-1:hover { 34 transform: translate(0, -6px); 35 box-shadow: 10px -10px 25px 0 rgba(143, 64, 248, 0.5), -10px 10px 25px 0 rgba(39, 200, 255, 0.5); 36} 37 38.btn-1:hover::after { 39 transform: rotate(150deg); 40}
1.1K views
1.1K views
Comments
MIT License