Docs
Fade in out
Fade in out
Displays a fade in out component.
Fade In and Out
Installation
Install the following dependencies:
npm install framer-motionCopy and paste the Fade in out code into your project.
API Reference
Props
| Prop | Type | Description |
|---|---|---|
text | string | The text to be displayed inside the component. |
className | string | Optional custom class for the container, defaults to text-4xl font-bold text-center. |
transitionDuration | number | Optional duration for the fade-in/fade-out animation, defaults to 2. |
Usage
export default function Demo() {
return (
<FadeInOut
text="Fade In and Out"
className="text-5xl font-bold text-center text-blue-500"
transitionDuration={3}
/>
)
};