Revealreveal-rise

Text rise

Masked clip-path rise — text climbs into view.

Headline

tap / hover to play

<motion.div
  initial={{ clipPath: "inset(100% 0 0 0)", y: 12 }}
  animate={{ clipPath: "inset(0% 0 0 0)", y: 0 }}
  transition={{ duration: 0.5, ease: [0.32, 0.72, 0, 1] }}
/>

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

Personality

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

Related Reveal moves

Blur in

Focus-pulls into place from a soft blur

Unfold

scaleY from the top edge, like an accordion

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