Attentionshimmer

Shimmer

Skeleton loading sweep across a surface.

tap / hover to play

<motion.div
  animate={{ backgroundPosition: ["200% 0", "-200% 0"] }}
  transition={{ duration: 1.5, repeat: Infinity, ease: "linear" }}
  style={{
    background: "linear-gradient(90deg,#eee 25%,#f5f5f5 50%,#eee 75%)",
    backgroundSize: "200% 100%",
  }}
/>

How to use it

Copy-paste

Grab the code above and drop it onto any motion.* element.

Or name it

In Claude Code / Cursor, run /ss-motion shimmer and the recipe lands in your code.

Personality

Pairs naturally with the silk seed (smooth, elegant).

Related Attention moves

Heartbeat

Looping scale pulse — alive, rhythmic

Wiggle

Quick horizontal shake — error / wrong input

20+ named motion moves

All copy-paste, all in StyleSeed’s design engine. MIT.

Browse the gallery Star