244 views
1#pen1 { 2 animation: pen1 2s infinite ease; 3} 4 5#pen2 { 6 animation: pen2 2s infinite ease; 7} 8 9#pen3 { 10 animation: pen3 2s infinite ease; 11} 12 13#loader { 14 animation: loaderColor 5s infinite ease; 15} 16 17@keyframes pen1 { 18 0% { 19 transform: translateY(0px); 20 } 21 22 15% { 23 transform: translateY(-10px); 24 } 25 26 30% { 27 transform: translateY(0px); 28 } 29} 30 31@keyframes pen2 { 32 30% { 33 transform: translateY(0px); 34 } 35 36 45% { 37 transform: translateY(-10px); 38 } 39 40 60% { 41 transform: translateY(0px); 42 } 43} 44 45@keyframes pen3 { 46 60% { 47 transform: translateY(0px); 48 } 49 50 75% { 51 transform: translateY(-10px); 52 } 53 54 90% { 55 transform: translateY(0px); 56 } 57} 58 59@keyframes loaderColor { 60 0% { 61 fill: #513B56; 62 } 63 64 33% { 65 fill: #348AA7; 66 } 67 68 66% { 69 fill: #5DD39E; 70 } 71 72 100% { 73 fill: #513B56; 74 } 75}
JkHuger
JkHuger
MIT License