Blur Animations

Blur transition component for smooth reveal animations, powered by Framer Motion.

BlurIn

Animates children by transitioning from a blurred to clear state with fade effect.

import { BlurIn } from "@prismlinkapp/ui/animations/blur";
 
<BlurIn variant="h1" duration={1.5}>
  Blur In Animation
</BlurIn>;

Prop	Type	Default	Description
children	`ReactNode`	Required	Content to animate with blur effect
className	`string`	`""`	Additional CSS classes to apply to wrapper element
variant	`"p" \| "h1" \| "h2" \| "h3" \| "h4" \| "h5" \| "h6" \| "div" \| "span"`	`"h1"`	HTML element type to render as wrapper
duration	`number`	`1`	Animation duration in seconds