Loader by Pradeepsaranbishnoi
#212121
1.container { 2 width: 150px; 3 height: 10px; 4 border: 2px solid #b2b2b2; 5 border-radius: 7px; 6 margin: 0 auto; 7 padding: 2px 1px; 8 overflow: hidden; 9 font-size: 0; 10} 11 12.box { 13 width: 9px; 14 height: 100%; 15 background: linear-gradient(to bottom, #2838c7 0%,#5979ef 17%,#869ef3 32%,#869ef3 45%,#5979ef 59%,#2838c7 100%); 16 display: inline-block; 17 margin-right: 2px; 18 animation: loader 2s infinite; 19 animation-timing-function: linear; 20} 21 22.logo { 23 width: 220px; 24 margin: 50px auto; 25 margin-top: 20px; 26} 27 28.logo p { 29 margin: 0; 30 padding: 0; 31} 32 33.top { 34 font-size: 16px; 35 font-weight: 300; 36 line-height: 16px; 37} 38 39.top:after { 40 content: "\00a9"; 41 font-size: 10px; 42 position: relative; 43 top: -5px; 44 margin-left: 2px; 45} 46 47.mid { 48 font-size: 46px; 49 font-weight: 700; 50 line-height: 36px; 51} 52 53.mid span { 54 font-size: 22px; 55 display: inline-block; 56 vertical-align: top; 57 color: #FF6821; 58 margin-top: -8px; 59} 60 61.logo .bottom { 62 font-size: 30px; 63 font-weight: 300; 64 line-height: 30px; 65 margin-left: 5px; 66} 67 68@keyframes loader { 69 0% { 70 transform: translate(-30px); 71 } 72 73 100% { 74 transform: translate(150px); 75 } 76} 77
1.3K views
1.3K views
MIT License