The RotateIn component creates a smooth rotation animation for its children when they enter the viewport.
Add it with the CLI, open it in v0, or copy the source into your project.
Adds the component and installs its dependencies for you.
npx shadcn@latest add https://uibeats.com/r/rotate-in.jsonEverything Rotate In accepts.
| Prop | Type | Default | Description |
|---|---|---|---|
| children (required) | React.ReactNode | No default | The content to be rotated in |
| duration | number | 0.5 | Duration of the animation (in seconds) |
| delay | number | 0 | Delay before the animation starts (in seconds) |
| rotateFrom | number | 90 | Initial rotation angle (in degrees) |
| className | string | '' | Additional CSS classes for styling |
| once | boolean | true | Whether to trigger the animation only once |
Required.