> ## Documentation Index > Fetch the complete documentation index at: /llms.txt > Use this file to discover all available pages before exploring further. # Orbit Carousel 4 > Image cards on a spinning 3D Fibonacci sphere, billboarded to the camera, sized by camera distance (Orbit style 4); 24 image slots. # Orbit Carousel 4 Image cards on a spinning 3D Fibonacci sphere, billboarded to the camera, sized by camera distance (Orbit style 4); 24 image slots. **Orbit Carousel 4** ```html carousel-orbit-4.html theme={null} Image Carousel · Orbit 4
``` Copy npx hyperframes add carousel-orbit-4 to the clipboard That writes `compositions/carousel-orbit-4.html`, plus 24 supporting files under `assets/carousel-images/`. ## Add it to your video It runs for 6 seconds at 1920×1080. Paste this into your composition: ```html index.html theme={null}
``` Move it in time with `data-start`. Put it on a different timeline row with `data-track-index`. See [data attributes](/concepts/data-attributes.md) for the rest. ## Variables Every one of these has a default, so the piece works untouched. Set the ones you want to change on the element: | Variable | Default | Accepts | What it does | | - | - | - | - | | `image1` | `assets/carousel-images/artist-bob-seger.jpg` | image | Image on card 1 of 24. Any aspect; it is fitted into the card box. | | `image2` | `assets/carousel-images/artist-dire-straits.jpg` | image | Image on card 2 of 24. Any aspect; it is fitted into the card box. | | `image3` | `assets/carousel-images/artist-faces.jpg` | image | Image on card 3 of 24. Any aspect; it is fitted into the card box. | | `image4` | `assets/carousel-images/artist-little-feat.jpg` | image | Image on card 4 of 24. Any aspect; it is fitted into the card box. | | `image5` | `assets/carousel-images/artist-north-mississippi-allstars.jpg` | image | Image on card 5 of 24. Any aspect; it is fitted into the card box. | | `image6` | `assets/carousel-images/artist-sea-level.jpg` | image | Image on card 6 of 24. Any aspect; it is fitted into the card box. | | `image7` | `assets/carousel-images/artist-taj-mahal.jpg` | image | Image on card 7 of 24. Any aspect; it is fitted into the card box. | | `image8` | `assets/carousel-images/artist-tool.jpg` | image | Image on card 8 of 24. Any aspect; it is fitted into the card box. | | `image9` | `assets/carousel-images/artist-van-morrison.jpg` | image | Image on card 9 of 24. Any aspect; it is fitted into the card box. | | `image10` | `assets/carousel-images/pl-10-songs.jpg` | image | Image on card 10 of 24. Any aspect; it is fitted into the card box. | | `image11` | `assets/carousel-images/pl-bangers.jpg` | image | Image on card 11 of 24. Any aspect; it is fitted into the card box. | | `image12` | `assets/carousel-images/pl-bhindi-bhagee.jpg` | image | Image on card 12 of 24. Any aspect; it is fitted into the card box. | | `image13` | `assets/carousel-images/pl-chb-2.jpg` | image | Image on card 13 of 24. Any aspect; it is fitted into the card box. | | `image14` | `assets/carousel-images/pl-chb.jpg` | image | Image on card 14 of 24. Any aspect; it is fitted into the card box. | | `image15` | `assets/carousel-images/pl-homework.jpg` | image | Image on card 15 of 24. Any aspect; it is fitted into the card box. | | `image16` | `assets/carousel-images/pl-sleeping.jpg` | image | Image on card 16 of 24. Any aspect; it is fitted into the card box. | | `image17` | `assets/carousel-images/pl-y2k.jpg` | image | Image on card 17 of 24. Any aspect; it is fitted into the card box. | | `image18` | `assets/carousel-images/track-back-together.jpg` | image | Image on card 18 of 24. Any aspect; it is fitted into the card box. | | `image19` | `assets/carousel-images/track-bitter-with-the-sweet.jpg` | image | Image on card 19 of 24. Any aspect; it is fitted into the card box. | | `image20` | `assets/carousel-images/track-cleaning-windows.jpg` | image | Image on card 20 of 24. Any aspect; it is fitted into the card box. | | `image21` | `assets/carousel-images/track-dixie-chicken-live-at-the-rainbow-theatre-london-u.jpg` | image | Image on card 21 of 24. Any aspect; it is fitted into the card box. | | `image22` | `assets/carousel-images/track-dweller-on-the-threshold.jpg` | image | Image on card 22 of 24. Any aspect; it is fitted into the card box. | | `image23` | `assets/carousel-images/track-far-east-man.jpg` | image | Image on card 23 of 24. Any aspect; it is fitted into the card box. | | `image24` | `assets/carousel-images/track-funky-shit.jpg` | image | Image on card 24 of 24. Any aspect; it is fitted into the card box. | | `speed` | `1` | 0.25 to 3, step 0.05 | Time scale of the carousel motion. 1 = the designed pace. | | `background` | `#EDEDEF` | color | Composition ground. | Set them with `data-variable-values` on the element that mounts it. These are the defaults, so this behaves exactly like the preview above until you change one: ```html wrap theme={null}
``` Tagged `carousel` `gallery` `images` `showcase` `orbit` `3d`. Created by Jake Moran. ## Related topics * [Browse the complete Catalog](/catalog.md) * [Add assets and Catalog items in the browser editor](/studio/assets-and-blocks.md) * [Put blocks together into one video](/concepts/compositions.md) ## Related topics - [Orbit Carousel 1](/catalog/blocks/carousel-orbit-1.md) - [Orbit Carousel 2](/catalog/blocks/carousel-orbit-2.md) - [Orbit Carousel 3](/catalog/blocks/carousel-orbit-3.md) This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.