Tab Bar Customisation Tutorial

Tab Bars provides the ability to quickly switch between different sections of an app. In this tutorial the look of the Tab Bar and its items will be customized. This tutorial is made with Xcode 8 and built for iOS 10.

Open Xcode and create a new Tabbed Application.

Choose Next. For product name, use IOS10TabBarCustomizationTutorial and then fill out the Organization Name and Organization Identifier with your customary values. Enter Swift as Language and make sure only iPhone is selected in Devices.

Go to the ViewController.swift file and change the viewDidLoad method to

override func viewDidLoad() {
    // Do any additional setup after loading the view, typically from a nib.
    guard let tabBar = self.tabBarController?.tabBar else { return }
    tabBar.tintColor = UIColor.white
    tabBar.barTintColor =
    tabBar.unselectedItemTintColor = UIColor.yellow
    guard let tabBarItem = self.tabBarItem else { return }
    tabBarItem.badgeValue = "123"
    tabBarItem.badgeColor =

The tintColor of the Tab Bar is set to white,  and the barTinitColor is set to black. When an item is unselected, its tint color is set to yellow. Each item can have a supplementary badge. Here a blue badge is created with the value of "123".

Build and Run the project, to see the visual customization of the Tab Bar.

You can download the source code of the IOS10TabBarCustomizationTutorial at the ioscreator repository on Github.