All Collections
Toolbar Color Scheme Modifier
Toolbar Color Scheme Modifier

Specify the preferred color scheme of a Navigation and/or Tab Bar.

Updated over a week ago


By default, a Toolbar’s color automatically adapts to a user’s display settings, switching between Light and Dark Mode.

You can override this behavior by configuring the color scheme to stay fixed in either Light or Dark Mode, regardless of a user’s display settings, with the Toolbar Color Scheme modifier.

You can customize the color scheme of your Navigation Bar, Tab Bar, or both from the Inspector panel.


To change the Toolbar color scheme of a navigation layer, apply the Toolbar Color Scheme modifier to a child in a Navigation Stack.

If you have both a Tab Bar and a Navigation Bar and you want to apply different settings to each one, add the Toolbar Color Scheme modifier twice to configure them separately.


If you want a consistent Toolbar color scheme across all of the screens in your Tab Bar, you must apply the Toolbar Color Scheme modifier to each one.

Did this answer your question?