mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-27 20:50:21 +08:00
87 lines
1.3 KiB
HTML
87 lines
1.3 KiB
HTML
<div class="loader">
|
|
<span class="ani">L</span>
|
|
<span class="ani">o</span>
|
|
<span class="ani">a</span>
|
|
<span class="ani">d</span>
|
|
<span class="ani">i</span>
|
|
<span class="ani">n</span>
|
|
<span class="ani">g</span>
|
|
</div>
|
|
<style>
|
|
/* From Uiverse.io by Tsiangana - Tags: simple, animation, loading, loader, text animation */
|
|
.loader {
|
|
font-family: Roboto, sans-serif;
|
|
font-size: 25px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.ani:nth-child(1) {
|
|
animation: ani1 2.1s ease-in-out 14s infinite;
|
|
}
|
|
|
|
@keyframes ani1 {
|
|
50% {
|
|
font-size: 40px;
|
|
}
|
|
}
|
|
|
|
.ani:nth-child(2) {
|
|
animation: ani2 2.1s ease-in-out 12s infinite;
|
|
}
|
|
|
|
@keyframes ani2 {
|
|
50% {
|
|
font-size: 40px;
|
|
}
|
|
}
|
|
|
|
.ani:nth-child(3) {
|
|
animation: ani3 2.1s ease-in-out 10s infinite;
|
|
}
|
|
|
|
@keyframes ani3 {
|
|
50% {
|
|
font-size: 40px;
|
|
}
|
|
}
|
|
|
|
.ani:nth-child(4) {
|
|
animation: ani4 2.1s ease-in-out 8s infinite;
|
|
}
|
|
|
|
@keyframes ani4 {
|
|
50% {
|
|
font-size: 40px;
|
|
}
|
|
}
|
|
|
|
.ani:nth-child(5) {
|
|
animation: ani5 2.1s ease-in-out 6s infinite;
|
|
}
|
|
|
|
@keyframes ani5 {
|
|
50% {
|
|
font-size: 40px;
|
|
}
|
|
}
|
|
|
|
.ani:nth-child(6) {
|
|
animation: ani6 2.1s ease-in-out 4s infinite;
|
|
}
|
|
|
|
@keyframes ani6 {
|
|
50% {
|
|
font-size: 40px;
|
|
}
|
|
}
|
|
|
|
.ani:nth-child(7) {
|
|
animation: ani7 2.1s ease-in-out 2s infinite;
|
|
}
|
|
|
|
@keyframes ani7 {
|
|
50% {
|
|
font-size: 40px;
|
|
}
|
|
}
|
|
</style>
|