Navbar

Examples

Navbar

<div class="w-full">
  <dv-navbar class="dv-bgbase100 dv-roundedbox">
    <dv-button variant="ghost">daisyui vue</dv-button>
  </dv-navbar>
</div>
vue

Navbar with icons

<div class="w-full">
  <dv-navbar class="dv-bgbase100 dv-roundedbox">
    <dv-navbar-center class="flex-1">
      <dv-button variant="ghost">daisyui vue</dv-button>
    </dv-navbar-center>
    <dv-navbar-end>
      <dv-button variant="ghost">
        <icon-ellipsis-horizontal />
      </dv-button>
    </dv-navbar-end>
  </dv-navbar>
</div>
vue

Navbar with icon at start and end

<div class="w-full">
  <dv-navbar class="dv-bgbase100 dv-roundedbox">
    <dv-navbar-start class="flex-1">
      <dv-button variant="ghost"><icon-menu /></dv-button>
      <dv-button variant="ghost">daisyui vue</dv-button>
    </dv-navbar-start>
    <dv-navbar-end>
      <dv-button variant="ghost">
        <icon-ellipsis-horizontal />
      </dv-button>
    </dv-navbar-end>
  </dv-navbar>
</div>
vue

Navbar

Attributes

namedescriptiontypedefault

NavbarStart

Attributes

namedescriptiontypedefault

NavbarCenter

Attributes

namedescriptiontypedefault

NavbarEnd

Attributes

namedescriptiontypedefault