mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 13:10:21 +08:00
24 lines
632 B
HTML
24 lines
632 B
HTML
<div class="loader"></div>
|
|
<style>
|
|
/* From Uiverse.io by doniaskima - Tags: neumorphism, 3d, action, loader, image, flip, jelly, realistic */
|
|
.loader {
|
|
width: 50px;
|
|
aspect-ratio: 1;
|
|
border-radius: 50%;
|
|
background: radial-gradient(farthest-side,#000 98%,#0000) 55% 20%/8px 8px no-repeat,
|
|
#ffcc00;
|
|
box-shadow: 2px -6px 12px 0px inset rgba(0, 0, 0, 0.7);
|
|
animation: l4 .5s infinite steps(5) alternate;
|
|
}
|
|
|
|
@keyframes l4 {
|
|
|
|
0% {
|
|
clip-path: polygon(50% 50%,100% 0,100% 0,0 0,0 100%,100% 100%,100% 100%)
|
|
}
|
|
|
|
100% {
|
|
clip-path: polygon(50% 50%,100% 65%,100% 0,0 0,0 100%,100% 100%,100% 35%)
|
|
}
|
|
}
|
|
</style>
|