Introduction

Changing the navigation bar title color in SwiftUI is slightly awkward because SwiftUI does not expose every navigation bar text attribute directly. In practice, the most reliable solution is still to configure UINavigationBarAppearance and let SwiftUI's NavigationStack or NavigationView use that UIKit appearance. Newer SwiftUI toolbar modifiers help with bar styling, but title text color is still commonly controlled through appearance APIs.

Use UINavigationBarAppearance

A standard approach is to create and configure a navigation bar appearance object, then assign title text attributes.

1import SwiftUI
2
3@main
4struct DemoApp: App {
5    init() {
6        let appearance = UINavigationBarAppearance()
7        appearance.configureWithOpaqueBackground()
8        appearance.backgroundColor = .systemBackground
9        appearance.titleTextAttributes = [.foregroundColor: UIColor.systemRed]
10        appearance.largeTitleTextAttributes = [.foregroundColor: UIColor.systemRed]
11
12        UINavigationBar.appearance().standardAppearance = appearance
13        UINavigationBar.appearance().scrollEdgeAppearance = appearance
14        UINavigationBar.appearance().compactAppearance = appearance
15    }
16
17    var body: some Scene {
18        WindowGroup {
19            NavigationStack {
20                Text("Hello")
21                    .navigationTitle("Home")
22            }
23        }
24    }
25}

This works because SwiftUI navigation bars on iOS are backed by UINavigationBar.

Understand What the Two Title Settings Mean

There are two separate text attributes to think about:

• 'titleTextAttributes for inline titles'
• 'largeTitleTextAttributes for large navigation titles'

If you only set one of them, your title may change color in one display mode but not the other.

.navigationBarTitleDisplayMode(.large)

or

.navigationBarTitleDisplayMode(.inline)

Both modes should be tested if your app uses them.

SwiftUI Toolbar Styling Helps, but It Is Different

SwiftUI provides modifiers such as toolbarBackground and toolbarColorScheme, but those do not directly map to every title text attribute.

1NavigationStack {
2    Text("Hello")
3        .navigationTitle("Home")
4        .toolbarBackground(.visible, for: .navigationBar)
5        .toolbarBackground(Color.blue, for: .navigationBar)
6        .toolbarColorScheme(.dark, for: .navigationBar)
7}

These modifiers are useful because they influence how the system chooses readable foreground content for the bar, but if you need a very specific title color, the UIKit appearance route is still the most explicit option.

Scope the Appearance Carefully

Global appearance configuration affects every navigation bar in the app. If that is too broad, you may need a more localized approach using a custom UIViewControllerRepresentable, a hosting controller boundary, or a feature-specific navigation container.

For many apps, a global style is acceptable and simpler. For apps with very different bar themes across sections, global appearance can become too blunt.

One practical consequence is that title color changes are often app-wide decisions, not tiny view-local tweaks. If one screen needs a radically different navigation title style than the rest of the app, it is usually a sign that you need a more isolated UIKit bridge rather than another SwiftUI modifier on the view.

That is also why screenshots from one iOS version do not always match another exactly. SwiftUI and UIKit navigation styling continue to evolve, so explicit appearance configuration is usually more predictable than relying on defaults.

Common Pitfalls

The biggest mistake is expecting .foregroundColor on the title view content to change the navigation bar title automatically. It usually does not affect the actual bar title text.

Another issue is setting only standardAppearance and forgetting scrollEdgeAppearance. That often leads to the title color looking correct in one scroll state and different in another.

People also sometimes style only the background and forget the distinction between inline titles and large titles. If both are used, both attribute dictionaries should be set.

Finally, be careful with global appearance in previews and tests. A global appearance change can affect unrelated screens and make UI behavior harder to reason about.

Summary

• The most reliable way to change navigation bar title color in SwiftUI is usually UINavigationBarAppearance.
• Set both titleTextAttributes and largeTitleTextAttributes if the app uses both title styles.
• SwiftUI toolbar modifiers help style the bar, but they do not replace all title text customization.
• Configure standardAppearance, scrollEdgeAppearance, and compactAppearance for consistency.
• Use global appearance only if the whole app should share the same navigation bar style.