Revealreveal-blur

Blur in

Focus-pulls into place from a soft blur.

Focus

tap / hover to play

<motion.div
  initial={{ opacity: 0, filter: "blur(12px)", scale: 0.96 }}
  animate={{ opacity: 1, filter: "blur(0px)", scale: 1 }}
  transition={{ duration: 0.6, ease: "easeOut" }}
/>

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

Personality

Pairs naturally with the float seed (weightless, dreamy).

Related Reveal moves

Text rise

Masked clip-path rise — text climbs into view

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