Animations & Motion
Crystalline
Physics-based fragmentation with rotating crystal shards.
cursormagneticshattercrystalparticles
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
backgroundColor | string | bg-zinc-950 | Background color of the component |
title | string | Crystalline | Title text displayed |
subtitle | string | Move quickly to see shards | Subtitle text displayed |
velocityThreshold | number | 5 | Velocity threshold for shard creation |
particleColor | string | rgba(255, 255, 255, 1) | Color of the shard particles |
sizeMin | number | 2 | Minimum shard size |
sizeMax | number | 8 | Maximum shard size |
lifeDecay | number | 0.02 | Shard life decay rate |
gravity | number | 2 | Gravity effect on shards |
spinRange | [number, number] | [-5, 5] | Range of spin rotation |
angleRange | [number, number] | [0, 360] | Range of initial angles |
className | string | Additional CSS classes |