Skeleton Shine
A highlight sweeps left to right — the classic skeleton loader.
Preview
Tune parameters
Full code
/* Skeleton Shine */
@keyframes skeletonShine {
0% { background-position: -200% 0; }
100% { background-position: 200% 0; }
}
.skeleton-shine { background: linear-gradient(90deg, #e2e8f0 25%, #f8fafc 37%, #e2e8f0 63%); background-size: 200% 100%; animation: skeletonShine 1.4s ease-in-out infinite; }