Switch by MikeAndrewDesigner
#212121
1.switch { 2 font-size: 17px; 3 position: relative; 4 display: inline-block; 5 width: 8.5em; 6 height: 3.3em; 7} 8 9.switch input { 10 opacity: 0; 11 width: 0; 12 height: 0; 13} 14 15.slider { 16 position: absolute; 17 cursor: pointer; 18 top: 0; 19 left: 0; 20 right: 0; 21 bottom: 0; 22 background: #2c2c2c; 23 transition: .4s; 24 border-radius: 30px; 25} 26 27.slider::before { 28 position: absolute; 29 content: ""; 30 height: 28px; 31 width: 28px; 32 border-radius: 20px; 33 left: 13px; 34 bottom: 14px; 35 background: linear-gradient(144deg,#af40ff,#5b42f3 50%,#00ddeb); 36 transition: .4s; 37} 38 39.switch input:checked + .slider:before { 40 transform: translateX(5.1em); 41} 42 43.intro { 44 color: #fff; 45 padding-right: 0.5em; 46 font-size: 22px; 47} 48
412 views
412 views
MIT License