Blur Focus In
Blur Focus In text animation for Remotion.
PrimitivePrimitivesAdvanced
blur-focus-in30fps · 960×540
Install
$ npx remotion-ui@latest add blur-focus-inBlur Focus In text animation primitive.
Agent notes
Install first, then import the copied source component locally. AI guide →
Import
@/remotion/primitives/blur-focus-in- Use when: frame-level motion primitives and reusable animation wrappers.
- Customize: text, durationInFrames, maxBlur, plus copied source for timing, layout, colors, and typography.
- Rule: do not import this component from the
remotion-uinpm package; it is copied into your project.
Usage
Example
import { BlurFocusIn } from "@/remotion/primitives/blur-focus-in";
<BlurFocusIn text="Sharp focus" maxBlur={18} />API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| text* | string | - | Text to reveal from blur. |
| durationInFrames | number | 36 | Blur-to-sharp duration. |
| maxBlur | number | 18 | Starting blur in pixels. |