Blur In
A heavy blur-to-clear entrance animation triggered on scroll.
npx arupui add blur-in
Preview
Blur In Effect
Usage
blur-in.tsx
import { BlurIn } from "@/components/blocks/blur-in"
<BlurIn delay={0.2}>
<h1>Content</h1>
</BlurIn>Props
| Prop | Type | Default |
|---|---|---|
delay | number | 0 |
duration | number | 0.6 |
delayType:
numberDefault: 0durationType:
numberDefault: 0.6