Animations & Motion
Accordion Text
Characters expand vertically on hover with rotation and scale effects.
textanimationaccordionhoverexpand
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
text | string | EXPANSION | Text to display |
backgroundColor | string | bg-zinc-950 | Background color of the component |
textColor | string | text-zinc-300 | Color of the text |
hoverColor | string | #fff | Color on hover |
textSize | string | text-8xl md:text-9xl | Size of the text |
containerHeight | string | h-[120px] | Height of the container |
scaleY | number | 1.2 | Vertical scale on hover |
margin | string | 0 10px | Margin on hover |
rotation | number | 5 | Rotation angle in degrees |
springStiffness | number | 300 | Spring animation stiffness |
springDamping | number | 15 | Spring animation damping |
className | string | Additional CSS classes |