Low tide
Nazaré, dawn
12 tracks · 48 min
Orbit Carousel
Items on a rotating 3D ring with depth fade and an orbit track, turned by drag, clicks, buttons or arrow keys, and a flat crossfade under reduced motion.
Preview
Night market
Taipei, 11 pm
14 tracks · 52 min
Now showing Night market · drag, click a side card, or use the arrow keys
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| label | string | — | Accessible name of the carousel. Required. |
| index | number | — | Front item (controlled). Pair with onIndexChange. |
| defaultIndex | number | 0 | Front item when uncontrolled. |
| onIndexChange | (index: number) => void | — | Called with the new front index. |
| itemWidth | number | 180 | Width of each item in px; sets the ring radius. |
| gap | number | 72 | Extra space between neighbours on the ring, in px. |
| controls | boolean | true | Show previous/next buttons and position dots. |
| getItemLabel | (index: number) => string | — | Names each slide for screen readers. Defaults to "n of N". |
| stageClassName | string | — | Classes for the 3D stage; set its height here (default h-72). |
| data-orbit-detail | attribute | — | Put on text inside a slide; it fades out on every card except the front one. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.