<Sidebar class="!bg-gray-50" collapsed={false}>
  <SidebarItems>
    <SidebarItemGroup>
      <SidebarItem href="#" icon={HiChartPieSolid}>Dashboard</SidebarItem>
      <SidebarItem href="#" icon={HiViewBoardsSolid} label="Pro" labelColor="gray">Kanban</SidebarItem>
      <SidebarItem href="#" icon={HiInboxSolid} label="3">Inbox</SidebarItem>
      <SidebarItem href="#" icon={HiUserSolid}>Users</SidebarItem>
      <SidebarItem href="#" icon={HiShoppingBagSolid}>Products</SidebarItem>
      <SidebarItem href="#" icon={HiArrowSmRightSolid}>Sign In</SidebarItem>
      <SidebarItem href="#" icon={HiTableSolid}>Sign Up</SidebarItem>
    </SidebarItemGroup>
  </SidebarItems>
</Sidebar>

<Sidebar class="!bg-gray-50" collapsed={false}>
  <SidebarItems>
    <SidebarItemGroup>
      <SidebarItem href="#" icon={HiChartPieSolid}>Dashboard</SidebarItem>
      <SidebarCollapse icon={HiShoppingBagSolid} label="E-commerce">
        <SidebarItem href="#">Products</SidebarItem>
      </SidebarCollapse>
      <SidebarItem href="#" icon={HiInboxSolid}>Inbox</SidebarItem>
      <SidebarItem href="#" icon={HiUserSolid}>Users</SidebarItem>
      <SidebarItem href="#" icon={HiShoppingBagSolid}>Products</SidebarItem>
      <SidebarItem href="#" icon={HiArrowSmRightSolid}>Sign In</SidebarItem>
      <SidebarItem href="#" icon={HiTableSolid}>Sign Up</SidebarItem>
    </SidebarItemGroup>
  </SidebarItems>
</Sidebar>

<Sidebar class="!bg-gray-50" collapsed={false}>
  <SidebarItems>
    <SidebarItemGroup>
      <SidebarItem href="#" icon={HiChartPieSolid}>Dashboard</SidebarItem>
      <SidebarItem href="#" icon={HiViewBoardsSolid}>Kanban</SidebarItem>
      <SidebarItem href="#" icon={HiInboxSolid}>Inbox</SidebarItem>
      <SidebarItem href="#" icon={HiUserSolid}>Users</SidebarItem>
      <SidebarItem href="#" icon={HiShoppingBagSolid}>Products</SidebarItem>
      <SidebarItem href="#" icon={HiArrowSmRightSolid}>Sign In</SidebarItem>
      <SidebarItem href="#" icon={HiTableSolid}>Sign Up</SidebarItem>
    </SidebarItemGroup>
    <SidebarItemGroup>
      <SidebarItem href="#" icon={HiChartPieSolid}>Upgrade to Pro</SidebarItem>
      <SidebarItem href="#" icon={HiViewBoardsSolid}>Documentation</SidebarItem>
      <SidebarItem href="#" icon={HiSupportSolid}>Help</SidebarItem>
    </SidebarItemGroup>
  </SidebarItems>
</Sidebar>

<Sidebar class="!bg-gray-50" collapsed={false}>
  <SidebarItems>
    <SidebarItemGroup>
      <SidebarItem href="#" icon={HiChartPieSolid}>Dashboard</SidebarItem>
      <SidebarItem href="#" icon={HiViewBoardsSolid}>Kanban</SidebarItem>
      <SidebarItem href="#" icon={HiInboxSolid}>Inbox</SidebarItem>
      <SidebarItem href="#" icon={HiUserSolid}>Users</SidebarItem>
      <SidebarItem href="#" icon={HiShoppingBagSolid}>Products</SidebarItem>
      <SidebarItem href="#" icon={HiArrowSmRightSolid}>Sign In</SidebarItem>
      <SidebarItem href="#" icon={HiTableSolid}>Sign Up</SidebarItem>
    </SidebarItemGroup>
  </SidebarItems>
  <SidebarCTA>
    <div class="mb-3 flex items-center">
      <Badge color="yellow">Beta</Badge>
      <Button
        aria-label="Close"
        class="-mx-1.5 -my-1.5 ml-auto !h-6 !w-6 bg-transparent !p-1 text-blue-900 hover:bg-blue-200 dark:!bg-blue-900 dark:text-blue-200 dark:hover:!bg-blue-800"
        data-collapse-toggle="dropdown-cta"
      >
        <span class="sr-only"> Close </span>
        <HiXOutline class="h-4 w-4" />
      </Button>
    </div>
    <p class="mb-3 text-sm text-blue-900 dark:text-blue-400">
      Preview the new Flowbite dashboard navigation! You can turn the new navigation off for a limited time in
      your profile.
    </p>
    <a
      class="text-sm text-blue-900 underline hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300"
      href="#"
    >
      Turn new navigation off
    </a>
  </SidebarCTA>
</Sidebar>

<Sidebar class="!bg-gray-50" collapsed={false}>
  <SidebarLogo href="#" img="favicon.png" imgAlt="Flowbite logo">Flowbite</SidebarLogo>
  <SidebarItems>
    <SidebarItemGroup>
      <SidebarItem href="#" icon={HiChartPieSolid}>Dashboard</SidebarItem>
      <SidebarItem href="#" icon={HiViewBoardsSolid}>Kanban</SidebarItem>
      <SidebarItem href="#" icon={HiInboxSolid}>Inbox</SidebarItem>
      <SidebarItem href="#" icon={HiUserSolid}>Users</SidebarItem>
      <SidebarItem href="#" icon={HiShoppingBagSolid}>Products</SidebarItem>
      <SidebarItem href="#" icon={HiArrowSmRightSolid}>Sign In</SidebarItem>
      <SidebarItem href="#" icon={HiTableSolid}>Sign Up</SidebarItem>
    </SidebarItemGroup>
  </SidebarItems>
</Sidebar>