Images placed on a sphere and dragged around it, kept flat and scaled by depth.
Unlock component
One license unlocks every pro feature for life, including the ones we haven't built yet.
Already have an account? Sign in
| Name | Type | Default | Description |
|---|---|---|---|
children | ReactNode | — | Elements placed on the sphere, one point each. Required. |
radius | number | 160 | Distance in pixels from the center of the sphere to each child. |
perspective | number | 900 | Perspective distance in pixels. |
reveal | boolean | true | Animation played when the component mounts. |
drag | boolean | true | Spin the sphere by dragging it. |
wheel | boolean | true | Spin the sphere with the mouse wheel or trackpad. |
smoothing | number | 0.05 | How smooth the sphere follows drag and wheel input. |
className | string | — | Class names applied to the container. |
Motion
React animation library.