Layout

Navbar

A sticky top bar with title/description and left/right action slots.

vue
<UiNavbar />

Options

One block per prop — what it does, and what it looks like set.

Title

title is the page title displayed in the center. Ignored when the default slot is used.

Dashboard

Renders as a Card (tag="header"), not a plain <header> — pass class to override its background/ring like any Card.

Description

description is the quieter second line under the title — the environment, the plan, whatever qualifies the name above it. It's ignored the moment you use the default slot, which replaces that whole area.

Dashboard

Overview of your workspace


Examples

The component in real use: compositions that answer "how do I build X with this", rather than one prop at a time.

`left`/`right` slots — back button, search, notifications, user menu

Projects
3

Default slot — centered search, `left`/`right` for logo and sign in

The default slot (used for a search input in the third example) sits between the #left and #right slots and stretches via flex-1.


API Reference

Generated from the component's source — props, slots and emits as the component actually declares them.

Props

Prop
Type
Default
Description
string
—
The page title displayed in the center. Ignored when the default slot is used.
string
—
Secondary text displayed below the title. Ignored when the default slot is used.

Slots

Slot
left
default
right