Branding
Change App Colors
What to customize:
SwiftAIBoilerplatePro/Resources/DesignSystemColors.xcassets/
├── Primary.colorset
├── AccentPrimary.colorset
├── BubbleUser.colorset
└── BubbleAssistant.colorset
- Open color set in Xcode
- Change Light Appearance color
- Change Dark Appearance color
- Build → Colors update everywhere!
All components use design tokens - change once, applies everywhere.
Replace App Icon
Steps:
- Create 1024×1024 PNG
- Drag to
Assets.xcassets/AppIcon.appiconset
- Xcode generates all required sizes
- Build and verify
Customize Onboarding
File: SwiftAIBoilerplatePro/AppShell/OnboardingPage.swift
Change the pages array:
static let pages: [OnboardingPage] = [
OnboardingPage(
title: "Your Title",
description: "Your description",
systemImage: "sparkles" // Any SF Symbol
),
// Add more pages...
]
UI Customization
Add Home Screen Feature Card
File: SwiftAIBoilerplatePro/AppShell/HomeContent.swift
public let features: [FeatureData] = [
// ... existing cards
FeatureData(
icon: "bookmark.fill",
title: "Your Feature",
description: "Feature description",
tag: "New"
),
]
Change Chat Bubble Colors
Files:
DesignSystemColors.xcassets/
├── BubbleUser.colorset # User message color
└── BubbleAssistant.colorset # AI message color
Add Custom Theme
Create Color Sets
In DesignSystemColors.xcassets, create color sets for all semantic colors
Add Theme Case
enum UserThemePreference: String {
case system, light, dark, aurora, obsidian
case myTheme // Add this
}
Map Colors
In DSColors.swift, add color mappings for your theme
Add to Picker
In SettingsView, add your theme to the picker
Feature Customization
Add Custom AI Persona
File: ChatViewModel.swift (in your feature)
func sendMessage(_ text: String) async {
let systemPrompt = LLMMessage(
role: .system,
content: """
You are a professional Swift developer.
Provide clear, concise answers with code examples.
"""
)
let messages = [systemPrompt] + history + [userMessage]
// Stream with persona
}
Add New SwiftData Model
Create Model
@Model
class YourModel {
@Attribute(.unique) var id: UUID
var property: String
var createdAt: Date
}
Create DTO
struct YourModelDTO: Identifiable, Sendable {
let id: UUID
let property: String
init(_ model: YourModel) {
self.id = model.id
self.property = model.property
}
}
Create Repository
Protocol + implementation following existing patterns
Add to Schema
In CompositionRoot.swift, add to Schema array
Add Custom Setting
Update Settings Model
@Model
class Settings {
var theme: UserThemePreference
var yourSetting: Bool = false // Add this
}
Update ViewModel
@Observable
class SettingsViewModel {
var yourSetting: Bool
func toggleYourSetting(_ enabled: Bool) async {
// Save to repository
}
}
Update UI
Toggle("Your Setting", isOn: $viewModel.yourSetting)
.onChange(of: viewModel.yourSetting) {
Task { await viewModel.toggleYourSetting($0) }
}
Backend Customization
Change AI Model
File: supabase/functions/ai/index.ts
// Change this line:
const model = "openai/gpt-4o-mini"
// To any OpenRouter model:
const model = "anthropic/claude-3-5-sonnet"
const model = "google/gemini-2.0-flash"
// ... 500+ models available
supabase functions deploy ai
Add Usage Limits
func canSendMessage() async -> Bool {
let state = await paymentsClient.currentState()
if state.isSubscribed {
return true // Unlimited for pro
} else {
let count = await messageRepository.todayCount()
return count < 20 // Free tier limit
}
}
Module Customization
Each module has detailed customization examples:
Core
Custom errors, log categories
Networking
Custom requests, interceptors
Storage
New models, repositories
Auth
Social providers, custom fields
Payments
New tiers, usage limits
AI
Models, personas, prompts
FeatureChat
UI styles, actions, search
FeatureSettings
New settings, paywall
DesignSystem
Themes, components, tokens
Pro Tips
Test after each change - Don’t stack multiple changes without testing
Use design tokens - Never hardcode colors or spacing
Follow existing patterns - Look for similar features first
Keep files ≤ 300 lines - Extract components when needed
Need More Help?
