iOS 15
UITabBarController
tabBar color issue
iOS development
UI bug

iOS 15 UITabBarController's tabBar background color turns black

Master System Design with Codemia

Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.

Introduction

The black tab bar background issue on iOS 15 is usually not a random rendering bug. It is most often the result of UIKit's newer appearance system, especially scrollEdgeAppearance, taking over when only the older tab bar properties were customized. If you set barTintColor or backgroundColor the old way and ignore the appearance objects, iOS 15 may render a default-looking bar instead of the color you expected.

Use UITabBarAppearance Instead of Older Styling Only

Starting with modern iOS appearance APIs, the stable way to control the tab bar background is through UITabBarAppearance.

swift
1let appearance = UITabBarAppearance()
2appearance.configureWithOpaqueBackground()
3appearance.backgroundColor = .white
4
5tabBarController.tabBar.standardAppearance = appearance

This gives UIKit an explicit background model instead of leaving it to infer one from older properties.

The important detail on iOS 15 is that standardAppearance alone is often not enough.

Set scrollEdgeAppearance Too

iOS 15 introduced more consistent use of scroll-edge appearances. If you only set standardAppearance, the tab bar can still switch to a different appearance in certain layouts and look black or translucent.

swift
1let appearance = UITabBarAppearance()
2appearance.configureWithOpaqueBackground()
3appearance.backgroundColor = .systemBackground
4
5tabBarController.tabBar.standardAppearance = appearance
6tabBarController.tabBar.scrollEdgeAppearance = appearance

That second assignment is the fix many apps were missing when they moved to iOS 15.

If the controller hierarchy is built in SceneDelegate or from a custom tab bar controller subclass, apply the appearance there so it happens consistently during setup.

Global Appearance Configuration Also Works

If the app wants one consistent tab bar style everywhere, configure the appearance proxy.

swift
1let appearance = UITabBarAppearance()
2appearance.configureWithOpaqueBackground()
3appearance.backgroundColor = .white
4appearance.stackedLayoutAppearance.selected.iconColor = .systemBlue
5appearance.stackedLayoutAppearance.selected.titleTextAttributes = [.foregroundColor: UIColor.systemBlue]
6
7UITabBar.appearance().standardAppearance = appearance
8UITabBar.appearance().scrollEdgeAppearance = appearance

This is often the cleanest option for multi-tab apps that do not need screen-specific styling.

Avoid Mixing Too Many Old and New APIs

A common cause of inconsistent results is mixing these at the same time:

  • 'barTintColor'
  • 'isTranslucent'
  • 'backgroundImage'
  • 'shadowImage'
  • appearance objects

Some of those older properties still work in certain cases, but the more reliable path on iOS 15 and later is to express the bar appearance through UITabBarAppearance directly.

That does not mean every old property is forbidden. It means the appearance object should be the source of truth.

Check Dark Mode and Transparency Assumptions

Sometimes the bar is not truly "turning black" because of a bug. It is rendering a translucent or default system background in a context where your content underneath makes it appear dark. configureWithOpaqueBackground() is a strong default when you want a predictable solid color.

If your design intentionally wants translucency, then you need to test both light and dark appearance carefully instead of assuming the visual result will match iOS 14 behavior.

Common Pitfalls

  • Setting only barTintColor and expecting iOS 15 to ignore UITabBarAppearance.
  • Configuring standardAppearance but forgetting scrollEdgeAppearance.
  • Mixing old tab bar styling properties and new appearance objects without one clear source of truth.
  • Assuming the issue is a random black-color bug when it is actually transparency or default appearance fallback.
  • Applying the appearance in only one code path and getting inconsistent results across scenes or tab bar controllers.

Summary

  • On iOS 15, tab bar background styling should be handled through UITabBarAppearance.
  • Set both standardAppearance and scrollEdgeAppearance for consistent results.
  • Use configureWithOpaqueBackground() when you want a stable solid background color.
  • Avoid relying only on older styling properties such as barTintColor.
  • Treat the appearance object as the primary source of truth for tab bar visuals.

Course illustration
Course illustration

All Rights Reserved.