marketing/DSHeroSection
DSHeroSection
marketingFull-width landing page hero with an announcement badge, headline, subheadline, CTA buttons, and a social proof row.
iOS 17+macOS 14+
Purpose
First above-the-fold section of a marketing or app landing page.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| badge | String? | nil | Small announcement badge above the headline. |
| headlinereq | String | — | Main heading. |
| subheadlinereq | String | — | Supporting copy. |
| primaryCTAreq | DSHeroCTA | — | Primary button (label + action). |
| secondaryCTA | DSHeroCTA? | nil | Secondary button. |
| socialProof | [DSUserAvatar]? | nil | Avatars + trust copy. |
Examples
App landing hero
Hero section for a productivity app.
swift
DSHeroSection(
badge: "Now in public beta",
headline: "Build faster with SwiftDS",
subheadline: "60+ production-ready SwiftUI components with a unified design token system.",
primaryCTA: DSHeroCTA(label: "Get started free", action: { navigate(.signup) }),
secondaryCTA: DSHeroCTA(label: "View documentation", action: { navigate(.docs) })
)