Revealreveal-unfold

Unfold

scaleY from the top edge, like an accordion.

Panel

tap / hover to play

<motion.div
  style={{ transformOrigin: "top" }}
  initial={{ scaleY: 0, opacity: 0 }}
  animate={{ scaleY: 1, opacity: 1 }}
  transition={{ type: "spring", stiffness: 300, damping: 30 }}
/>

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 reveal-unfold and the recipe lands in your code.

Personality

Pairs naturally with the spring seed (bouncy, energetic).

Related Reveal moves

Blur in

Focus-pulls into place from a soft blur

Text rise

Masked clip-path rise — text climbs into view

Pop in

Spring overshoot from zero — bouncy arrival

20+ named motion moves

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

Browse the gallery Star