Pro Components

Base Components

Sidebar 3

Sidebar with collapsible sections (Dashboard, Docs), breadcrumb in main area, and separator.

Example

Introduction

Side Sheet 3 includes:
  • Collapsible sections: Dashboard (Overview, Analytics) and Docs (Getting started, API) with expand/collapse triggers.
  • Separator between nav and Settings.
  • Main area: Breadcrumb (Home / Dashboard / Overview) and content.
Uses Button and Collapsible. Good for doc-style or dashboard layouts with grouped links.

Usage

import { Sidebar20 } from "@/components/ui/sidebar-20";

<Sidebar20 />;
Replace sections and breadcrumb segments with your routes and content.

On this page

ExampleIntroductionInstallationUsage