Loader by Bethel-nz
#e8e8e8
1.pl, 2.pl__worm { 3 animation-duration: 3s; 4 animation-iteration-count: infinite; 5} 6 7.pl { 8 animation-name: bump9; 9 animation-timing-function: linear; 10 width: 8em; 11 height: 8em; 12} 13 14.pl__ring { 15 stroke: hsla(var(--hue),10%,10%,0.1); 16 transition: stroke 0.3s; 17} 18 19.pl__worm { 20 animation-name: worm9; 21 animation-timing-function: cubic-bezier(0.42,0.17,0.75,0.83); 22} 23 24/* Animations */ 25@keyframes bump9 { 26 from, 27 42%, 28 46%, 29 51%, 30 55%, 31 59%, 32 63%, 33 67%, 34 71%, 35 74%, 36 78%, 37 81%, 38 85%, 39 88%, 40 92%, 41 to { 42 transform: translate(0,0); 43 } 44 45 44% { 46 transform: translate(1.33%,6.75%); 47 } 48 49 53% { 50 transform: translate(-16.67%,-0.54%); 51 } 52 53 61% { 54 transform: translate(3.66%,-2.46%); 55 } 56 57 69% { 58 transform: translate(-0.59%,15.27%); 59 } 60 61 76% { 62 transform: translate(-1.92%,-4.68%); 63 } 64 65 83% { 66 transform: translate(9.38%,0.96%); 67 } 68 69 90% { 70 transform: translate(-4.55%,1.98%); 71 } 72} 73 74@keyframes worm9 { 75 from { 76 stroke-dashoffset: 10; 77 } 78 79 25% { 80 stroke-dashoffset: 295; 81 } 82 83 to { 84 stroke-dashoffset: 1165; 85 } 86}
1.6K views
MIT License