Introduction

In UIKit, the back button in a navigation bar usually gets its color from the navigation bar's tintColor. If the back arrow is not using the color you expect, the problem is usually that the wrong property is being changed or the appearance API is being configured in an inconsistent way.

How the Back Button Gets Its Color

The standard back indicator and bar button items inherit the navigation bar tint. That means the first fix is usually simple:

1import UIKit
2
3final class DetailViewController: UIViewController {
4    override func viewDidLoad() {
5        super.viewDidLoad()
6        navigationController?.navigationBar.tintColor = .systemRed
7    }
8}

This changes the chevron color for that navigation controller. If the screen is pushed inside the same navigation stack, the effect is visible immediately.

What does not work is changing unrelated properties such as barTintColor and expecting the back arrow to follow. barTintColor affects the background, not the back button tint.

Global Styling for the Whole App

If the app has one consistent navigation style, configure it once through the appearance proxy during startup.

1import UIKit
2
3@main
4class AppDelegate: UIResponder, UIApplicationDelegate {
5    func application(
6        _ application: UIApplication,
7        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
8    ) -> Bool {
9        UINavigationBar.appearance().tintColor = .systemBlue
10        return true
11    }
12}

That is the cleanest option for a UIKit app with one brand color. It avoids per-screen styling drift and makes the back button, other bar buttons, and interactive elements match automatically.

Modern Configuration with UINavigationBarAppearance

For iOS 13 and later, the rest of the navigation bar is usually configured through UINavigationBarAppearance. You still use tintColor for the back button, but the appearance object keeps the bar background and title styling consistent.

1import UIKit
2
3func configureNavigationBarAppearance() {
4    let appearance = UINavigationBarAppearance()
5    appearance.configureWithOpaqueBackground()
6    appearance.backgroundColor = .white
7    appearance.titleTextAttributes = [
8        .foregroundColor: UIColor.label
9    ]
10
11    let navBar = UINavigationBar.appearance()
12    navBar.standardAppearance = appearance
13    navBar.scrollEdgeAppearance = appearance
14    navBar.compactAppearance = appearance
15    navBar.tintColor = .systemGreen
16}

If standardAppearance is configured but scrollEdgeAppearance is left different, the back button may appear correct on one screen and different on another. That inconsistency is common in apps with large titles.

Per-Screen Overrides

Some apps need one screen to stand out, for example a destructive confirmation flow or a branded onboarding section. In that case, override the navigation bar after the controller is shown.

1import UIKit
2
3final class WarningViewController: UIViewController {
4    override func viewWillAppear(_ animated: Bool) {
5        super.viewWillAppear(animated)
6        navigationController?.navigationBar.tintColor = .systemOrange
7    }
8
9    override func viewWillDisappear(_ animated: Bool) {
10        super.viewWillDisappear(animated)
11        navigationController?.navigationBar.tintColor = .systemBlue
12    }
13}

This is practical, but it is easy to overuse. If many screens do this, styling becomes hard to reason about and bugs start to look random.

Changing the Shape, Not Just the Color

If you want a custom arrow image instead of the default chevron, set the back indicator image on the appearance object. Keep the image in template rendering mode so tintColor still applies.

1import UIKit
2
3let appearance = UINavigationBarAppearance()
4appearance.configureWithDefaultBackground()
5appearance.setBackIndicatorImage(
6    UIImage(systemName: "arrow.backward"),
7    transitionMaskImage: UIImage(systemName: "arrow.backward")
8)
9UINavigationBar.appearance().standardAppearance = appearance
10UINavigationBar.appearance().scrollEdgeAppearance = appearance
11UINavigationBar.appearance().tintColor = .systemPurple

If the image has hardcoded pixels instead of template rendering, changing tintColor will seem broken because the image is not tintable.

Back Button Title Behavior

Sometimes developers think the back button color is wrong when the real problem is the text label. The back button shown on a pushed screen comes from the previous controller's navigation item.

1import UIKit
2
3final class ListViewController: UIViewController {
4    override func viewDidLoad() {
5        super.viewDidLoad()
6        navigationItem.backButtonDisplayMode = .minimal
7    }
8}

That hides the back title while keeping the arrow. The color still comes from the navigation bar tint.

Common Pitfalls

The biggest mistake is setting barTintColor and expecting it to recolor the back arrow. It will not.

Another common issue is styling the current screen when the visible back button was configured by the previous screen or by the navigation controller itself. That makes the change appear ineffective.

Projects that mix appearance proxies, per-screen overrides, and custom navigation bars often end up with inconsistent tints between large-title and compact states. If you use UINavigationBarAppearance, configure all relevant appearance slots together.

Finally, a custom back indicator image must be template-friendly if you want tinting to work. Otherwise the icon color is fixed by the asset itself.

Summary

• The standard back button color is controlled by UINavigationBar.tintColor.
• Use UINavigationBarAppearance for modern, consistent bar styling.
• Prefer global styling unless there is a clear reason to override one screen.
• 'barTintColor changes the bar background, not the back arrow tint.'
• Custom back images should use template rendering if they still need to respect tint color.