shadcn/ui
Docs
Components
Blocks
Charts
Themes
Examples
Colors
Toggle Menu
Search documentation...
Search...
⌘
K
GitHub
Twitter
Toggle theme
New sidebar component
Building Blocks for the Web
Beautifully designed. Copy and paste into your apps. Open Source.
Browse Blocks
Request a block
A simple sidebar with navigation grouped by section.
npx shadcn add sidebar-01
Open in New Tab
Open in
A sidebar with collapsible sections.
npx shadcn add sidebar-02
Open in New Tab
Open in
A sidebar with submenus.
npx shadcn add sidebar-03
Open in New Tab
Open in
A floating sidebar with submenus.
npx shadcn add sidebar-04
Open in New Tab
Open in
A sidebar with collapsible submenus.
npx shadcn add sidebar-05
Open in New Tab
Open in
A sidebar with submenus as dropdowns.
npx shadcn add sidebar-06
Open in New Tab
Open in
A sidebar that collapses to icons.
npx shadcn add sidebar-07
Open in New Tab
Open in
An inset sidebar with secondary navigation.
npx shadcn add sidebar-08
Open in New Tab
Open in
Collapsible nested sidebars.
npx shadcn add sidebar-09
Open in New Tab
Open in
A sidebar in a popover.
npx shadcn add sidebar-10
Open in New Tab
Open in
A sidebar with a collapsible file tree.
npx shadcn add sidebar-11
Open in New Tab
Open in
A sidebar with a calendar.
npx shadcn add sidebar-12
Open in New Tab
Open in
A sidebar in a dialog.
npx shadcn add sidebar-13
Open in New Tab
Open in
A sidebar on the right.
npx shadcn add sidebar-14
Open in New Tab
Open in
A left and right sidebar.
npx shadcn add sidebar-15
Open in New Tab
Open in
A simple login form.
npx shadcn add login-01
Open in New Tab
Open in
