Nav Menu Horizontal

The Nav Menu Horizontal is a top navigation bar with several items and a blue underline marking the active route. It anchors the global structure of wide, desktop-oriented Power Apps and keeps primary destinations one click away.

Pro component

Subscribe to access this component and the full library.

View plans

Home

Docs

Settings

YAML source

Preview — full code with PRO

# Nav Menu Horizontal — PowerBlocks (PRO)
# The active underline is a plain Rectangle (no radius needed).

- NavMenuHorizontal:
    Control: GroupContainer
    Variant: ManualLayout
    Properties:
      Width: =640
      Height: =52
      Fill: =RGBA(23, 23, 23, 1)
      DropShadow: =DropShadow.None
    Children:
      - NavItemHome:
          Control: GroupContainer
# … full component definition unlocked with PRO

This is a partial preview. Unlock the full component →

Common use cases

Desktop app navigation

Use it as the persistent top bar on landscape apps where horizontal space is plentiful.

Section switching

Let users move between the main areas of the app while the underline shows where they are.

Tabbed dashboards

Drive different dashboard views from a single header row.

How to use Nav Menu Horizontal in Power Apps

1Open the component page — the YAML uses the invariant Power Fx syntax and works in every Power Apps locale.
2Click "Copy YAML" to copy the full component definition to your clipboard.
3In Power Apps Studio, open your screen in the Tree view and paste (Ctrl+V) — the component appears ready to use.
4Rebind the data-driven properties (Items, OnSelect, Fill, Text) to your own data source and theme.

Tip — Store the active route in a variable and compare it per item so the underline follows navigation reliably.

Related navigation components

Top App Bar

Stepper

Tabs

Sidebar Nav