Kinetic Text
A headline that reveals word by word with spring motion, blur, and a soft accent glow.
textintrospring
Usage
Installation
npx shadcn@latest add https://remotionui.dev/r/kinetic-text.jsonCopies the composition to components/remotion/kinetic-text.tsx and installs remotion if missing. No UI library required.
Props
| Prop | Default | Description |
|---|---|---|
| textstring | "Ship video like you ship UI" | The headline, split on spaces. |
| accentWordnumber | 4 | Index of the word that gets the accent colour. |
| accentstring | "#2f7cf6" | Accent colour and glow. |
| backgroundstring | "#0b0b0d" | Background fill. |
| foregroundstring | "#f5f5f7" | Colour of the non-accent words. |
| fontFamilystring | system stack | Font stack to render with. |
| staggernumber | 5 | Frames between each word entering. |