About
A workspace or CRM header: a workspace switcher with a check on the current one, context breadcrumbs, global search with Cmd/Ctrl+K, notifications with a dot and a user menu with an account card. From VibeUI — 1,600+ components with agent-ready install briefs at vibeui.club.
Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Workspace Navbar to your project and fits it to your theme.
Code
How Workspace Navbar is used: the demo's code. The component's own source comes with a free account.
Usage.tsx
import { Navbar007 } from "@/components/ui/vibeui-navbar-007"
export default function Demo() {
return <Navbar007 {...{"workspace":"Contour Lab","workspaces":[{"label":"Atlas Group","href":"#atlas"},{"label":"Personal projects","href":"#personal"},{"label":"Create a workspace…","href":"#new"}],"crumbs":[{"label":"Projects","href":"#projects"},{"label":"Storefront","href":"#storefront"},{"label":"Analytics"}],"searchPlaceholder":"Search the workspace","searchLabel":"Global search","notificationsLabel":"Notifications","userInitials":"AK","userName":"Anna Kovaleva","userMenu":[{"label":"Profile","href":"#profile"},{"label":"Settings","href":"#settings"},{"label":"Sign out","href":"#logout"}]}} />
}
More in Navigation
View all
Sidebar
229
Tabs
60
Newsletter Signup Footer
15
Progress Bar Stepper
36
Footer 2
200
Navbar with Theme Toggle
43
Sortable Sidebar Navigation
51
Pagination
43
