Custom tab bar colors

Question

I have an app with a tab bar that I would like to customize. The background color for the tab bar should be hex color #DC4848, and the icons white.

struct ContentView: View {
    
    var body: some View {
        TabView {
            
            // Home page tab
        
            NavigationView {
                HomeView()
            }
            
            .tag(0)
            .tabItem {
                Image(systemName: "house")
                    .resizable().aspectRatio(contentMode: .fit)
                    .foregroundColor(.white)
                Text("Home")
            }

            // Explore Page
            
            NavigationView {
                PreviewView()
            }
            .tag(1)
            .tabItem {
                Image(systemName: "magnifyingglass")
                Text("Explore")
            }

            // Library Page
            
            NavigationView {
                HomeView()
                  }
                   .tag(2)
                    .tabItem {
                    Image(systemName: "ellipsis")
                        Text("More")
                            
                }
        }
       
    }
}

I tried accent color but it didn't work.

user_19528389 · Answer

I ran into this problem myself. Just add this code to the top of your content view and it should fix it.

init() {
      UITabBar.appearance().unselectedItemTintColor = UIColor.white
        UITabBar.appearance().backgroundColor = UIColor(Color(hex: "DC4848"))
      UITabBar.appearance().backgroundImage = UIImage()
    }

Custom tab bar colors

1 Answers