What's New
Recently added components and features. We've added 42 new components to help you build better apps faster.
screens9
DSCommandPalette
Command palette activated by ⌘K. Real-time filtering, section grouping, keyboard shortcuts, and arrow-key navigation.
DSOnboardingFlow
Multi-step onboarding flow with a step indicator, transition animations between screens, forward/back buttons, and a skip option.
DSActivityFeed
Vertical event feed with avatar, event type icon, description, and timestamp. Supports grouping by date.
DSNotificationCenter
Full notification centre with grouping by type, mark-all-read, per-notification actions, and empty state.
DSMediaGallery
Responsive photo/video grid with a full-screen viewer, pinch-to-zoom, and swipe-to-dismiss. Supports lazy loading.
DSChatBubble
Message bubble with sent/received alignment, timestamp, delivery status indicators, and support for text, image, and audio messages.
DSTaskCard
Task item card with a completion checkbox, priority badge, due date, assignee avatars, and a label/tag row.
DSDashboardScreen
Composable dashboard screen with a greeting header, KPI metric row, line/bar chart, activity feed, and quick-action buttons.
DSProfileHeroCard
Profile header card with avatar, name, bio, and stats.
data-visualization3
DSMetricCard
Dashboard widget with a primary metric, percentage change, animated sparkline, and label. Supports trending up/down/neutral.
DSLineChart
Animated line chart with a gradient fill, interactive tooltip on long-press, and configurable axes.
DSBarChart
Vertical bar chart with entry animation, value labels on each bar, and configurable axis labels.
marketing3
DSPricingCard
Subscription plan card with name, price, billing period, feature list with checkmarks, CTA, and highlighted state for the recommended plan.
DSFeatureCard
Marketing card with an icon, headline, and body text. Designed for feature grids on landing pages.
DSHeroSection
Full-width landing page hero with an announcement badge, headline, subheadline, CTA buttons, and a social proof row.
Navigation3
DSFloatingTabBar
Floating tab bar with capsule, rounded, or standard styles. Features smooth spring animations and matched geometry transitions.
DSTabBar
Horizontal scrollable tabs with animated underline indicator.
DSSubnavigation
Horizontal bar of selectable items for secondary navigation.
selection2
Layout2
inputs2
actions3
Feedback10
DSProgressRing
Generic circular progress ring with gradient support and customizable center content. Foundation for app-specific progress indicators.
DSCircularProgress
Circular ring with animated fill showing progress percentage.
DSStarRating
Display-only star rating showing a value from 0 to 5 stars.
DSStarRatingControl
Interactive star rating control allowing users to input ratings from 0 to 5.
DSStepIndicator
Horizontal progress bar showing current step in a multi-step process.
DSNoticeBar
Banner notice with icon, title, optional message, link, and dismiss button.
DSPageLoader
Full-screen loading overlay with centered spinner and optional message.
DSTidbit
Inline callout card with icon, title, body text, optional button, and dismiss.
DSFullPageInterruption
Full-screen modal overlay for critical interruptions like session expiry.
DSSkeletonCard
Card-shaped skeleton placeholder with pulsing animation for loading states.
data-display2
Media1
messaging2
DSMessageBubble
Chat message bubble with support for custom content, loading states, avatars, and asymmetric styling for user vs. other messages.
DSChatInputBar
Chat input field with send button, optional attachment button, and support for single-line or multi-line input.
More components coming soon
We're constantly adding new components and improving existing ones.
Get started with SwiftDS