#e8e8e8
1.spinner { 2 --gap: 5px; 3 --clr: #d62d20; 4 --height: 23px; 5 width: 100px; 6 height: 100px; 7 display: flex; 8 align-items: center; 9 justify-content: center; 10 gap: var(--gap); 11} 12 13.spinner span { 14 background: var(--clr); 15 width: 6px; 16 height: var(--height); 17 animation: grow 1s ease-in-out infinite; 18} 19 20.spinner span:nth-child(2) { 21 animation: grow 1s ease-in-out 0.15s infinite; 22} 23 24.spinner span:nth-child(3) { 25 animation: grow 1s ease-in-out 0.3s infinite; 26} 27 28.spinner span:nth-child(4) { 29 animation: grow 1s ease-in-out 0.475s infinite; 30} 31 32@keyframes grow { 33 0%,100% { 34 transform: scaleY(1); 35 } 36 37 50% { 38 transform: scaleY(1.8); 39 } 40}
1.3K views
1.3K views
Comments
MIT License