Loader by Diox221
#e8e8e8
1.loader { 2 display: flex; 3 justify-content: center; 4 align-items: center; 5 height: 100%; 6} 7 8.circle { 9 position: relative; 10 width: 40px; 11 height: 40px; 12 border-radius: 50%; 13 margin: 10px; 14 box-shadow: inset 0 0 0 2px #fff; 15 transform-origin: center; 16 animation: fill 1.5s ease-in-out infinite; 17} 18 19.circle-1 { 20 animation-delay: 0s; 21} 22 23.circle-2 { 24 animation-delay: -0.4s; 25} 26 27.circle-3 { 28 animation-delay: -0.8s; 29} 30 31.circle-4 { 32 animation-delay: -1.2s; 33} 34 35@keyframes fill { 36 0% { 37 transform: scale(1); 38 } 39 40 50% { 41 box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 6px #1c1c1e; 42 transform: scale(1.5); 43 } 44 45 100% { 46 box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 6px #fff; 47 transform: scale(1); 48 } 49} 50
375 views
375 views
MIT License