Skip to main content

Global Status Bar

The Global Status Bar is a full width view across the top of an application — an area commonly reserved for global status, global command and top-level navigation.

Appearance and Behavior

The Global Status Bar has four main parts: App Icon, App Title, App State, and Logged-in Username. Additional custom features can be added to the Global Status bar. Suggested elements include Clock, Monitoring Icons, and Buttons.

Simplest Global Status Bar - Only include the App Title.
Simplest Global Status Bar - Only include the App Title.
Standard Global Status Bar - App Icon, App Title, App State, and Logged-in Username
Standard Global Status Bar - App Icon, App Title, App State, and Logged-in Username
Complex Global Status Bar - App Icon, App Title, App State, Logged-in Username, Clock, and Monitoring Icons.
Complex Global Status Bar - App Icon, App Title, App State, Logged-in Username, Clock, and Monitoring Icons.

When using the alternate light theme in Astro, the Global Status Bar and all of the elements it contains still use the default dark theme styling.

Examples
Do: Correctly and consistently utilize the standard elements that comprise the Global Status Bar.
Do: Correctly and consistently utilize the standard elements that comprise the Global Status Bar.
Don’t: Use icons, labels and colors incorrectly.
Don’t: Use icons, labels and colors incorrectly.
Do: Left justify the application name. Additional custom elements should be centered in the Global Status Bar or right justified (when utilized).
Do: Left justify the application name. Additional custom elements should be centered in the Global Status Bar or right justified (when utilized).
Don’t: Use the Global Status Bar for controls or indications that come and go with different app modes. Reserve it for truly global elements.
Don’t: Use the Global Status Bar for controls or indications that come and go with different app modes. Reserve it for truly global elements.