Specimen Carousel

Specimen Carousel

An editorial carousel for type, product, or archive specimens with numbered tabs and hard snap motion.

Installation

▸ Run the following command

npx shadcn@latest add https://www.mellowui.com/r/specimen-carousel.json

▸ Or install manually

  1. Copy the source from the Code tab above.
  2. Place it at components/mellow/specimen-carousel.tsx
  3. Import and use.

API Reference

PropTypeDefaultDescription
itemsSpecimenItem[]Carousel items. Each item supports title, kicker, description, meta, and sample.
initialIndexnumber0Initial active item index.
autoPlaybooleanfalseAutomatically advance through items. Disabled when reduced motion is preferred.
intervalnumber4200Autoplay interval in milliseconds.
classNamestringAdditional CSS classes.
onIndexChange(index: number) => voidCalled whenever the active index changes.