SwiftUI Component Library
Browse 130+ production-ready SwiftUI building blocks. Search by feature, filter by theme or tier, and copy pure vanilla Swift code directly into Xcode.
Explore by App Feature & Workflow
Find complete sets of components and templates tailored for specific iOS app flows.
Onboarding & Welcome Screens
Crafted SwiftUI Onboarding Screens, Welcome Flows & Feature Walkthroughs
Paywalls & Subscriptions
High-Converting SwiftUI Paywall Views, Plan Selectors & Benefit Rows
Settings & Preferences
Apple-Standard iOS Settings Rows, Toggles & LabeledContent
Dashboards & Analytics
SwiftUI KPI Stat Tiles, Circular Progress Gauges & Data Displays
Account & User Profiles
SwiftUI Profile Avatars, PhotosPicker & User Badges
Texts & Typography(18 components)
Gradient typography, markdown links, localized inflection rules, typewriter animations, and SF font variants.
Text with Uneven Background & Gradient
Stylized display text with asymmetrical corner radiuses and mesh gradient background.
Text with Number Inflection Rules
Dynamic text demonstrating automatic localized pluralization syntax (^[(count) item](inflect: true)).
Text with Markdown Links
Rich text demonstrating inline markdown links, bolding, italics, and custom link styling.
Text with Dashed Stroke
Decorative heading enclosed in a dashed border stroke.
Text System Default Variants
Showcase of standard San Francisco system font weights and designs.
Text System Monospace Variants
Showcase of SF Mono typography for code, data, and numeric readouts.
Text System Rounded Variants
Showcase of SF Pro Rounded typography for friendly, consumer-facing interfaces.
Text System Serif Variants
Showcase of New York serif typography for editorial and reading experiences.
Text Style Default Variants
Comprehensive typography hierarchy showcase (Large Title down to Caption 2).
Text Date Styling Options
Built-in date/time text formatting variants (relative, timer, date, offset).
Text Styling Default Options
Text transformation samples (strikethrough, underline, kerning, baseline offset).
Text Truncation Modes
Comparison of .head, .middle, and .tail text truncation behaviors.
Text with Gradient
Headline text masked with a multi-stop linear gradient fill.
Relative Date Text
Automatically updating relative time formatting (e.g. "2 hours ago", "in 3 days").
Text Sequence with Timer
Dynamic text that cycles through a sequence of strings automatically using a timer.
Text Typing & Retracting Animation
Typewriter effect that types out and deletes sentences with a blinking cursor.
Text Dissolve Animation
Smooth cross-fade transition cycling through different phrases.
Monospace Expandable Text
Monospaced code/log snippet with tap-to-expand card layout.
Cards & Content Displays(8 components)
Feature cards, testimonial blockquotes, interactive product cards, and MapKit circle/polygon overlays.
Feature Card Basic
Clean card displaying an icon, title, and descriptive feature paragraph.
Feature Card in Rounded Rectangle
Elevated feature card with subtle background container for grid layouts.
Quote Card Fancy
Testimonial blockquote card with quotation marks, author attribution, and rating.
Product Card Basic Rectangle
Modern e-commerce product card with image thumbnail, price tag, and buy button.
Rating View (Half-Star Capable)
Dynamic 5-star rating view supporting full, half, and empty star states.
Map with Circular Overlay
MapKit integration card displaying interactive map with circular radius boundary.
Map with Polygon Overlay
MapKit card displaying bounded area polygons (e.g. zones or delivery regions).
Map with Polyline Overlay
MapKit card rendering navigation paths and multi-point tracking routes.
Settings, Lists & Rows(9 components)
Apple-standard settings rows, LabeledContent formatters, accordion FAQ disclosure groups, and footers.
Settings List Row Label Basic
Standard iOS settings navigation row with SF symbol and title.
Settings LabeledContent List Row
Settings row with title and right-aligned detail text using LabeledContent.
Settings Row with Custom LabeledContent
Rich settings item with custom badge and secondary status text.
LabeledContent with Formatters
Row displaying formatted values (currency, bytes, percentages, measurements).
List Row Compact with Title, Subtitle & Detail
3-tier information row with leading icon, title, subtitle, and trailing value.
Disclosure Group as FAQ
Accordion-style expandable/collapsible FAQ item with chevron animation.
FAQ List with Disclosure Groups
Complete multi-item expandable FAQ section for help screens.
Footer Basic
Minimal app version and copyright text footer for settings lists.
Footer Fancy
Polished footer with "Developed with ❤️ in Prague", company branding, and live app version.
Avatars & User Profiles(7 components)
Circular avatars with status badges, overlapping team stacks, and PhotosPicker integration.
Avatar Basic 62x62
Standard circular profile picture placeholder.
Contact Avatar 62x62
Contact avatar with initials badge and status indicator.
Avatar Stack
Overlapping horizontal stack of user avatars with "+X more" counter for teams and social apps.
Profile Picture with PhotoPicker
Interactive avatar with PhotosUI PhotosPicker integration for instant photo changes.
Profile Avatar Circle
Clean circular avatar with customizable image clipping and shadow.
Profile Avatar Rounded Rectangle
Modern squircle/rounded-rect avatar for contemporary dashboard designs.
Name Avatar with Random Color
Initials avatar with deterministic or randomized gradient backgrounds.
Charts & Gauges(5 components)
Linear milestone gauges, circular progress meters, speedometer dials, and watchOS accessory gauges.
Basic Gauge Component
Horizontal linear gauge component visualizing current vs. target progress.
Gauge with Values
Linear gauge with minimum, maximum, and current numerical milestone labels.
Circular Progress Gauge
Circular ring gauge with percentage display in the center.
Labeled Speed Gauge Circular
Speedometer-style dial gauge with unit labels and custom tint ranges.
Labeled Gauge Accessory Circular
Compact circular gauge optimized for watchOS complications and widget accessories.
Icons & Badges(7 components)
Settings icon containers, gradient badges, stroke containers, and pixel-perfect App Icon frames.
Icon with Background
Square rounded icon with solid background color for settings menus.
Icon with Gradient Background
SF Symbol on top of a smooth linear gradient background.
Icon with Stroke
SF Symbol enclosed in a colored border stroke container.
App Icon 60x60
Pixel-perfect 60x60 app icon showcase container.
App Icon 75x75 using AppIcon
Dynamically loaded main application icon container with standard iOS corner radius.
Badge with Symbol & Palette Rendering
Notification badge utilizing SF Symbol multi-tone palette colors.
Badge with Symbol & Linear Gradient
Pill badge with symbol and gradient fill for Pro features and tags.
Links & Sharing(5 components)
External Safari link rows, icon triggers, markdown links, and native iOS App Store ShareLink views.
Link Row Settings
Settings row that opens external Safari URLs with an external link indicator.
Link as Icon
Compact icon-only external URL link button.
Link as Button
Fully styled SwiftUI button that triggers web URL opening.
Link as Markdown Text with Emoji
Inline text link styled with emojis and markdown parsing.
App Store ShareLink
Native iOS ShareLink configured to share the app's App Store download link.
Onboarding & Welcome Screens(3 components)
Apple-style welcome flows, swipeable TabView carousels, and dark-mode immersive welcome screens.
Basic Welcome Screen
Classic Apple-style welcome screen with hero icon, 3 feature bullet rows, and bottom CTA button.
Onboarding TabView Basic
Multi-page swipeable onboarding carousel with page dots and persistent "Continue" button.
Sports Car App Welcome Screen
Immersive dark-mode onboarding screen with background media and bold typographic accents.
Paywalls & Subscriptions(3 components)
Benefit rows with checkmarks, cascading bounce animations, and selectable subscription plan choices.
Benefit Row Basic
Single paywall feature row with colored checkmark and benefit description.
Pro Benefits VStack with Bounce
Complete paywall feature list with cascading spring-in bounce animations.
Subscription Plan Choice with Checkmark
Selectable pricing tier card (Monthly vs. Annual) with radio checkmark and "Save 50%" tag.
Images & Effects(3 components)
Hero parallax image headers, custom shape masking, and tap-to-zoom spring animations.
Image with Text Overlay
Media container with gradient scrim and overlaid caption typography.
Image with Custom Mask
Image clipped with custom shape masks (stars, shields, rounded shapes).
Image with Scale Effect Animation
Hero image with interactive tap-to-zoom spring animation.
Labels(4 components)
System icon labels, gradient bordered badges, custom text icon pills, and initials monograms.
Label Basic with Icon
Standard Label component with system symbol and title.
Label Bordered Gradient
Label framed with a gradient border.
Label with Text Icon
Label pairing a text badge/tag with main description copy.
Label with Person Initials
Label featuring user initials monogram in place of an image.
SF Symbols & Animations(4 components)
Multicolor symbols, variable signal levels, iterative animations, and reversing cyclic effects.
Multicolor Symbol Basic
SF Symbol configured with native multicolor rendering mode.
Multicolor Symbol Variable
SF Symbol with variable value rendering (e.g. Wi-Fi or speaker signal levels).
Multicolor Symbol Variable Iterative
Animated SF Symbol using .variableColor.iterative animation phases.
Multicolor Symbol Variable Reversing
Reversing cyclic animation on variable SF Symbols.
Inputs & Text Editors(2 components)
Clean multi-line TextEditors and floating placeholder text containers.
Text Editor Simple
Clean multi-line TextEditor with standard border styling.
TextEditor with Placeholder & Custom Background
Enhanced TextEditor with floating placeholder support and custom background container.
Shapes, Chat & Real-Time(2 components)
Dynamic chat message speech bubbles and pulsing 3-dot typing indicators.
Tiles & Selectables(2 components)
Dashboard KPI navigation tiles and interactive selectable option cards.
Badges & Pills(1 components)
Follower/subscriber metric pills with formatted counts and leading icons.
Alerts & Modals(1 components)
Custom modal alert overlay views with actions and modern rounded containers.
Toasts & Feedback(1 components)
Floating square HUD toast messages for success, error, and status feedback.
Developer Templates & Architecture(3 components)
ContentUnavailableView empty states, centralized app styling constants, and microcopy architectures.
Content Unavailable View Template
Standard empty state template with icon, title, description, and action button.
App Styles Template
Architecture guide and code structure for centralized color palettes, padding constants, and corner radiuses.
App Microcopy Template
Structured template for organizing all user-facing copy into strongly-typed constants.