Sidebar 01 - Admin Dashboard Sidebar
A collapsible sidebar navigation with grouped menus, icons, and upgrade CTA, perfect for admin dashboards to organize pages, widgets, and apps while keeping workflows fast and intuitive.
src/components/shadcn-space/blocks/sidebar-01/page.tsx
import { SidebarProvider, SidebarTrigger } from "@/components/ui/sidebar";
import { AppSidebar } from "@/components/shadcn-space/blocks/sidebar-01/app-sidebar";
const Page = () => {
return (
<SidebarProvider>
<AppSidebar />
{/* ---------------- Main ---------------- */}
<div className="flex flex-1 flex-col">
<header className="sticky top-0 z-50 flex h-14 items-center border-b px-4">
<SidebarTrigger className="cursor-pointer"/>
</header>
<main className="flex-1 p-4" />
</div>
</SidebarProvider>
);
};
export default Page;
- Where it goes
- ctasidebardashboard-shellkanban
- Interaction
- accordiondropdown
- Use cases
- dashboard
DependenciesBundle weight · light
- icons
- lucide-react
More from Shadcnspace Figma Kit
About Us 01 - Impact MetricsblockAbout Us 02 - About the Platform with StatsblockAbout Us 03 - Experience & Impact About UsblockAbout Us 04 - Lifestyle Showcase About SectionblockAbout Us 05 - Platform OverviewblockAbout Us 06 - Minimal About UsblockAbout Us 07 - Business GrowthblockAbout Us 08 - Marketing Agency About Sectionblock
Browse all components in this library →