App Style
App style navbar with brand, links, and an avatar menu.
App style navbar with brand, links, and an avatar menu.
The source for every block is part of All Access. One purchase unlocks the entire library, today and in the future.
The source for every block is part of All Access. One purchase unlocks the entire library, today and in the future.
A signed in product header for dashboards and app shells, built with daisyUI and Tailwind CSS. The Acme brand mark leads a workspace nav of Dashboard, Projects, and Reports, while the right side holds a notification bell button and an avatar that opens an account dropdown with the user's name, Profile, Settings, Billing, and Sign out.
Avatar component and an example faceNav items come from a links array, and the avatar is rendered through components/ui/avatar with a sample person, so you can drop in your own user image. The dropdown uses daisyUI's menu dropdown-content with a menu-title for the name. Recolor the bell and links through daisyUI tokens.
The bell button and avatar trigger each carry an aria-label, and the workspace nav hides below the medium breakpoint so the bell and account menu remain reachable on smaller screens.