Navbar: Blazor navbar component

Examples

Regions

Start, Center and End map to navbar-start, navbar-center and navbar-end; only the ones you set are rendered.

website/Examples/Navigation/NavbarRegionsExample.razor Source

Colors

Color maps to bg-primary, bg-secondary and friends; add the matching text-*-content class for readable ink.

website/Examples/Navigation/NavbarColorsExample.razor Source

Custom content

Without any region, ChildContent fills the bar directly, here a task review strip with a bottom border.

website/Examples/Navigation/NavbarCustomExample.razor Source

Playground

ChildContent

Color Color

Bordered

Shadow

<Navbar Shadow="true">Acme Cloud</Navbar>

API

DaisyBlazor

Parameters

Bordered bool
= false
Renders a bottom border (border-b border-base-300) under the navbar.
Color Color
= Color.Default
Background color of the navbar, paired with its readable foreground: Default -> bg-base-100, Primary -> bg-primary text-primary-content, etc.
Shadow bool
= false
Adds a drop shadow (shadow-md) beneath the navbar.
Class string
= null
Extra CSS classes merged onto the root navbar element.
Style string
= null
Inline CSS styles applied to the root navbar element.

Name	Type	Default	Description
Bordered	bool	false	Renders a bottom border (border-b border-base-300) under the navbar.
Color	Color	Color.Default	Background color of the navbar, paired with its readable foreground: Default -> bg-base-100, Primary -> bg-primary text-primary-content, etc.
Shadow	bool	false	Adds a drop shadow (shadow-md) beneath the navbar.
Class	string	null	Extra CSS classes merged onto the root navbar element.
Style	string	null	Inline CSS styles applied to the root navbar element.

Content

Center RenderFragment
Content rendered inside the navbar-center region. Omit to hide the region.
ChildContent RenderFragment
Fallback content rendered directly inside the navbar when none of Start, Center or End are provided.
End RenderFragment
Content rendered inside the navbar-end region. Omit to hide the region.
Start RenderFragment
Content rendered inside the navbar-start region. Omit to hide the region.

Name	Type	Description
Center	RenderFragment	Content rendered inside the navbar-center region. Omit to hide the region.
ChildContent	RenderFragment	Fallback content rendered directly inside the navbar when none of Start, Center or End are provided.
End	RenderFragment	Content rendered inside the navbar-end region. Omit to hide the region.
Start	RenderFragment	Content rendered inside the navbar-start region. Omit to hide the region.

From MudAppBar

Navbar keeps MudAppBar's parameter names, so most markup moves over by dropping the Mud prefix. See the migration guide for the shared enums, icons and services.

Navbar