layout/DSCardCarousel

DSCardCarousel

layout
since 1.2.0

Horizontal scrolling carousel of cards with spacing and peek effect.

iOSmacOS

Purpose

Use to showcase featured content, products, or cards in a swipeable horizontal layout with visible peek of next card.

Props

PropTypeDefaultDescription
cardsreq[CardContent]โ€”Array of card content
cardWidthCGFloat280Width of each card
spacingCGFloatDSSpacing.mdSpace between cards

Examples

Featured products

Carousel of product cards.

swift
DSCardCarousel(
    cards: featuredProducts.map { product in
        CardContent(
            title: product.name,
            subtitle: product.price,
            image: product.image
        )
    },
    cardWidth: 300
)

Usage Guidelines

  • Use for 3-10 featured items
  • Cards should have consistent height
  • Peek effect encourages horizontal scrolling

Related Components