Skip to main content
Every app deserves to be usable by everyone. The Accessibility module makes building inclusive iOS apps effortless with pre-defined labels, SwiftUI modifiers, and comprehensive support for iOS accessibility features.
Package location: Packages/DesignSystem/Sources/DesignSystem/Accessibility/

​
Overview

The Accessibility module is part of the DesignSystem package and provides ready-to-use accessibility features that work with VoiceOver, Dynamic Type, Reduce Motion, and High Contrast modes out of the box.

Pre-defined VoiceOver Labels

Typed labels for common UI patterns, ready to apply

Dynamic Type

Text scales beautifully with user preferences

Reduce Motion

Respects motion sensitivity settings

High Contrast

Colors adapt for better readability

​
Quick Start

​
VoiceOver Labels

One line for full accessibility: 
import DesignSystem

// Apply pre-defined accessibility
Button("Send") { }
    .saiAccessible(A11y.Chat.sendButton)
// VoiceOver: "Send message, button. Double tap to send your message."

// Works for all common UI patterns
Image("avatar")
    .saiAccessible(A11y.Profile.photo)
// VoiceOver: "Profile photo. Double tap to change your profile photo."

​
Dynamic Type Support

Text scales beautifully with user preferences: 
Text("Respects user settings")
    .saiScaledFont(size: 18, weight: .semibold, relativeTo: .body)
// Automatically scales with iOS text size settings
// Capped to prevent layout issues at extreme sizes

​
Reduce Motion

Respects users who experience discomfort with animations: 
Button("Animate") { }
    .scaleEffect(isPressed ? 0.95 : 1.0)
    .saiReducedMotionAnimation(.spring())
// Animation plays normally OR instant state change
// Based on user's Reduce Motion setting

​
High Contrast Mode

Colors adapt automatically for users who need more contrast: 
Text("Adapts to user needs")
    .saiContrastAwareForeground(
        normal: DSColors.textSecondary,
        highContrast: DSColors.textPrimary
    )

​
File Structure

Packages/DesignSystem/Sources/DesignSystem/Accessibility/
├── A11y.swift          # Pre-defined labels (A11yLabel + A11y namespaces)
├── A11yModifiers.swift # SwiftUI modifiers (sai* View extensions)
└── A11yAudit.swift     # Debug-only audit overlay + checklist

​
Pre-Defined Labels

The A11y enum groups typed A11yLabel values by feature. Use A11y.<Group>.<label> directly, or extend the enum with your own (see Adding Custom Labels).
sendButton, messageInput, userMessage, assistantMessage, newChat, historyList, copyAction, deleteAction
signInApple, signInGoogle, emailInput, passwordInput, signOut
themeSelector, notificationsToggle, diagnosticsToggle, deleteAccount
photo, displayName, editButton
subscribeButton, restoreButton, planOption(name:price:), subscriptionStatus(isSubscribed:)
back, close, menu, tab(name:selected:)
loading, error(message:), success(message:), dismiss

​
Adding Custom Labels

​
1. Define Your Label

extension A11y {
    public enum MyFeature {
        public static let action = A11yLabel(
            label: "Custom action",
            hint: "Double tap to perform custom action"
        )
        
        public static let toggle = A11yLabel(
            label: "Enable feature",
            hint: "Double tap to toggle"
        )
    }
}

​
2. Apply to Views

Button("Action") { }
    .saiAccessible(A11y.MyFeature.action)

Toggle("Feature", isOn: $enabled)
    .saiAccessible(A11y.MyFeature.toggle)

​
SwiftUI Modifiers

​
.saiAccessible(_:)

Apply a pre-defined accessibility label: 
Button("Send") { }
    .saiAccessible(A11y.Chat.sendButton)

​
.saiAccessibilityHidden()

Hide decorative elements from VoiceOver: 
Image("background")
    .saiAccessibilityHidden()

​
.saiScaledFont(size:weight:relativeTo:)

Dynamic Type-aware font sizing: 
Text("Title")
    .saiScaledFont(size: 24, weight: .bold, relativeTo: .title)

​
.saiReducedMotionAnimation(_:)

Motion-sensitive animation: 
.saiReducedMotionAnimation(.spring(response: 0.3))

​
.saiContrastAwareForeground(normal:highContrast:)

High contrast color adaptation: 
.saiContrastAwareForeground(
    normal: .secondary,
    highContrast: .primary
)

​
Debug Tools

​
Accessibility Audit Overlay

accessibilityAuditOverlay(showWarnings:) is a DEBUG-only modifier that adds a toggle button and a colored-legend overlay to a view during development. It is compiled out of Release builds. 
#Preview {
    MainContent()
        .accessibilityAuditOverlay()
}
The overlay legend flags:
  • Red — critical issues (missing/empty labels, buttons without hints, images without labels, touch targets smaller than 44x44 points, insufficient contrast)
  • Yellow — warnings (generic or overly long labels, missing traits, redundant labels)
  • Green — accessible
For console output, A11yAudit.printResults(_:) prints issue and warning counts, and A11yChecklist.printChecklist() prints the manual review checklist.

​
Testing Accessibility

​
Unit Tests

func testAccessibilityLabels() {
    // label is non-optional; hint is String?
    XCTAssertFalse(A11y.Chat.sendButton.label.isEmpty)
    XCTAssertEqual(A11y.Chat.sendButton.hint, "Double tap to send your message")
}

​
UI Tests

func testVoiceOverNavigation() throws {
    let app = XCUIApplication()
    app.launch()
    
    // Find the button by its accessibility label
    let sendButton = app.buttons["Send message"]
    XCTAssertTrue(sendButton.exists)
    
    // Verify accessibility hint
    XCTAssertEqual(
        sendButton.label,
        "Send message"
    )
}

​
Manual Testing

1

Enable VoiceOver

Settings → Accessibility → VoiceOver → On
2

Navigate your app

Swipe right to move through elements
3

Verify announcements

Listen for clear, helpful descriptions
4

Test Dynamic Type

Settings → Display → Text Size → Largest

​
Best Practices

Label all interactive elements

Buttons, links, and controls need labels

Hide decorative images

Use .saiAccessibilityHidden() for backgrounds

Provide meaningful hints

Describe what happens when activated

Test with real users

Accessibility users find issues you miss

​
Test Coverage

Accessibility helpers are covered through DesignSystem tests and should also be verified manually with VoiceOver, Dynamic Type, Reduce Motion, and high contrast settings on a simulator or device.

Quick Start

Run the app before auditing accessibility

Architecture

Understand module boundaries

Localization Module

Type-safe strings and i18n

Design System

UI tokens and components