Loader by realrobertlogan
#212121
1.traffic-loader { 2 width: 50px; 3 height: 50px; 4 --c: radial-gradient(farthest-side, #fff 92%, #0000); 5 background: var(--c) 50% 0, var(--c) 50% 100%, var(--c) 100% 50%, 6 var(--c) 0 50%; 7 background-size: 10px 10px; 8 background-repeat: no-repeat; 9 animation: s8 1s infinite; 10 position: relative; 11} 12 13.traffic-loader::before { 14 content: ""; 15 position: absolute; 16 inset: 0; 17 margin: 3px; 18 background: repeating-conic-gradient(#0000 0 35deg, #fff 0 90deg); 19 -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 3px), #000 0); 20 border-radius: 50%; 21} 22 23@keyframes s8 { 24 100% { 25 transform: rotate(0.5turn); 26 } 27} 28
374 views
Variation of aloader
MIT License