marketing/DSFeatureCard

DSFeatureCard

marketing
since v2.0

Marketing card with an icon, headline, and body text. Designed for feature grids on landing pages.

iOS 17+macOS 14+

Purpose

Communicate product benefits in a visually consistent grid.

Props

PropTypeDefaultDescription
iconreqStringSF Symbol representing the feature.
titlereqStringFeature name.
descriptionreqStringFeature description.
iconColorColorDSColor.primaryIcon background tint.
action(() -> Void)?nilOptional learn-more action.

Examples

Features grid

6-feature grid on a landing page.

swift
LazyVGrid(columns: [GridItem(.flexible()), GridItem(.flexible())], spacing: DSSpacing.md) {
    DSFeatureCard(icon: "bolt.fill",  title: "Fast", description: "Optimised for performance.", iconColor: DSColor.warning)
    DSFeatureCard(icon: "lock.fill",  title: "Secure", description: "End-to-end encrypted.", iconColor: DSColor.success)
    DSFeatureCard(icon: "sparkles",   title: "Smart", description: "AI-powered suggestions.", iconColor: DSColor.primary)
}

Related Components