← Back to gallery
CSSFeatured

Shimmer Keyframe Loop

A project-authored CSS skeleton loader showcase where animation shorthand tunes looping shimmer cadence with custom keyframes, delays, and easing.

Duration
3s
Resolution
1440×900
Format
CSS
shimmerskeleton-loaderanimationkeyframes

Shimmer / skeleton / animation / keyframes

Shimmer keyframe loop

Reimplements skeleton shimmer with authored CSS keyframes while using animation shorthand to tune duration, easing, delay, and infinite looping for different loading cadences.

relay feed keyframe loop active — fast repeat + minimal rest

Continuous cards + near-zero idle gap

Relay Feed

Relay Feed lets a wide sweep repeat with almost no idle gap between passes so busy feed placeholders keep a brisk, always-warming cadence.

2.15s linear 0s infinite shimmerCadence

  • feed rhythm
  • continuous loop
  • steady loading

Editorial rows + eased middle slowdown

Tapered Digest

Tapered Digest softens the sweep through the center of the card so editorial placeholders feel composed instead of machine-like.

2.45s ease 90ms infinite shimmerCadence

  • editorial list
  • soft cadence
  • copy-heavy load

Slower work queue + deliberate rest window

Quiet Backlog

Quiet Backlog slows the sheen and leaves a short calm interval after each sweep so lower-priority loading states do not compete with live content.

2.8s ease-in-out 180ms infinite shimmerCadence

  • background tasks
  • reduced urgency
  • rest between sweeps