Carousel
Explore Bramble UI's interactive carousel component for dynamic content showcasing. Create captivating web experiences with modern carousel features.
Usage
import Data from '@/data/dogs.json'
import {Carousel} from '@/ui''
/* Data example
[
{
"name": "akita",
"src": "/img/dogs/akita.jpg",
"description": "The Akita is a Japanese dog breed of large size...",
"link": "https://en.wikipedia.org/wiki/Akita_(dog)"
},
...
] */
<Carousel
data={Data}
caption={true}
gallery={true}
/>
Gallery
Autoplay
<Carousel
data={Data}
autoplay={true}
gallery={true}
/>
Cards
akita
beagle
corgi
dachshund
husky
poodle
<Carousel
data={Data}
theme='light'
/>
Cards - Autoplay
akita
beagle
corgi
dachshund
husky
poodle
<Carousel
data={Data}
autoplay={true}
theme='light'
/>
RTL
akita
beagle
corgi
dachshund
husky
poodle
<div dir='rtl'>
<Carousel
data={Data}
theme='light'
rtl={true}
/>
</div>