All open-source packages
UISwift

SwiftUI-Design-System-Pro

Design tokens, a theme engine and tested SwiftUI components for Apple platforms

26StarsLatest Release: v2.0.0Updated: October 15, 2026
Platforms:iOS 17macOS 14tvOS 17watchOS 10visionOS 1

License: MIT

DesignSystemPro is a Swift package for SwiftUI apps that want one consistent look without building it from scratch. It has design tokens (colors, typography, spacing, borders, shadows, motion), a theme engine with light, dark, preset and brand themes, and about 40 component views built on the tokens. Every color token carries light, dark and high-contrast values, typography follows Dynamic Type, and a rendering test compares every component group in light and dark mode with stored reference fingerprints.

Features

  • Two-layer color tokens: a primitive palette and semantic roles, each with light, dark and high-contrast values
  • Typography tokens that scale with Dynamic Type through dsTypography(_:)
  • ThemeManager follows the system or applies a preset or a theme generated from brand colors; your views read it with @Environment(\.dsTheme)
  • Buttons, text fields (including search and OTP), toggles, checkboxes, radios, cards, badges, avatars, toasts and skeleton loaders
  • ColorContrastUtility computes WCAG contrast ratios; tests check body text and filled-button labels against WCAG AA in both color schemes
  • ThemeManager and DSToastManager are @MainActor @Observable classes with public initializers, so they can be injected and tested
  • One package for iOS, macOS, tvOS, watchOS and visionOS with no runtime dependencies, built in Swift 6 language mode

Quickstart

swift
1import DesignSystemPro
2import SwiftUI
3 
4struct ContentView: View {
5    @State private var notificationsOn = true
6 
7    var body: some View {
8        VStack(spacing: SpacingTokens.Content.comfortable) {
9            Text("Hello, DesignSystemPro")
10                .dsTypography(TypographyTokens.Heading.h2)
11 
12            DSStatusBadge("Ready", variant: .success)
13 
14            DSToggle(isOn: $notificationsOn, label: "Notifications")
15 
16            DSButton("Continue", isFullWidth: true) {
17                notificationsOn.toggle()
18            }
19        }
20        .padding(SpacingTokens.Layout.screenEdge)
21    }
22}

Installation

Swift Package Manager

swift
1dependencies: [
2    .package(url: "https://github.com/muhittincamdali/SwiftUI-Design-System-Pro.git", from: "2.0.0")
3],
4targets: [
5    .target(name: "YourApp", dependencies: [
6        .product(name: "DesignSystemPro", package: "SwiftUI-Design-System-Pro")
7    ])
8]

Xcode

text
1https://github.com/muhittincamdali/SwiftUI-Design-System-Pro.git

Screenshots

Components screen of the example app in light mode
Components screen of the example app in dark mode
DSButton variants and sizes rendered in light mode
DSButton variants and sizes rendered in dark mode
Badges and avatars in light mode
Badges and avatars in dark mode
Card components in light mode
Toggles, checkboxes and radio buttons in light mode
Toasts and skeleton loaders in dark mode

Timeline

  1. Repository opened with the first DSButton and DSCard views

  2. 1.0.0 tagged; the token, theme engine and component code that 2.0 is based on was written

  3. A clean-up replaced most of the sources with placeholder files

  4. Rebuilt as 2.0.0: tokens, theme engine and components restored, fixed and covered by Swift Testing suites

Links

GitHub RepositoryDocumentationSPM: https://github.com/muhittincamdali/SwiftUI-Design-System-Pro.git

Related Article

Read the article