Power Apps App Shell Components

One header with the brand, the navigation as tabs, a theme switch and the user; the content fills the whole width below. For small internal tools with up to six sections. Phone gets a bottom tab bar. Light and dark, with a switch.

For frontline apps used on a phone: inspections, timesheets, deliveries. A header with the app tile and the current page name, a bottom tab bar that is always there, content in between. Light and dark, with a switch.

A self-service portal such as an IT request desk or an HR portal: header with brand, tabs and user, a page band with title, subtitle and one primary action, and the content in a centred column that never gets too wide. Phone gets a bottom tab bar. Light and dark, with a switch.

List on the left, detail on the right: the layout of a helpdesk, a CRM or an approvals desk. An icon rail for navigation, a list pane with search and status pills, and the detail area for the selected row. On a phone the list fills the screen and a row opens the detail with a back arrow. Light and dark, with a switch.

The frame of a desktop-first business app: a 240 px sidebar with your brand, sectioned navigation, a theme switch and the signed-in user, and the content area beside it. On a phone the sidebar hides and a bottom tab bar takes over. Light and dark, with a switch.

The sidebar shell with a chevron that folds the sidebar to a 64 px icon rail, for dashboards that need the room. Labels hide, tooltips take over. Phone gets a bottom tab bar. Light and dark, with a switch.