Blur reveal.
Soft content resolves into a crisp surface.
See the movement
One intentional triggerPlayback starts only when you request it. Stop returns to the still illustration.
What it does
A brief blur can express focus or newly available information. Keep the blur radius small and avoid using this effect for long passages that people are trying to read.
Timing curve
ease-outDefault duration550ms
RepetitionOnce per trigger
Make the motion useful
Choose an effect that supports the component’s purpose. Keep the final state clear, preserve focus and reading order, and pair important feedback with a visible message.
CSS animation reference