- ##### Basic Components

- All
- Alert
- Button
- Badges
- Breadcrumb
- Cards
- Color
- Collapse
- Carousel
- Dropdowns
- Offcanvas
- Pagination
- Progress
- List group
- Modal
- Spinner
- Tabs & pills
- Tooltip
- Toasts
- Typography
- Other

- ##### Advance Components

- Sweet alert
- Datepicker
- Lightbox
- Modal
- Notification
- Rangeslider
- Slider
- Syntax Highlighter
- Tour
- Tree view

Explore Components

## Offcanvas

Build hidden sidebars into your project for navigation, shopping carts, and more with a few classes and our JavaScript plugin.

Reference

##### Live demo

##### Offcanvas

Content for the offcanvas goes here. You can place just about any Bootstrap component or custom elements here.
Link with href

##### Offcanvas

##### $746.5k +20.6

Past 30 days

Customer | Plan | MRP
--- | --- | ---
Logicoma | Team | -$72
UAC | Team | $199
Biffco | Team | -$72
Matsumura | Team | -$72
Biffco | Team | -$72
Logicoma | Team | -$72
UAC | Team | $199
Biffco | Team | -$72
Matsumura | Team | -$72
Biffco | Team | -$72

##### Placement

##### Offcanvas top

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

##### Offcanvas right

##### $746.5k +20.6

Past 30 days

Customer | Plan | MRP
--- | --- | ---
Logicoma | Team | -$72
UAC | Team | $199
Biffco | Team | -$72
Matsumura | Team | -$72
Biffco | Team | -$72
Logicoma | Team | -$72
UAC | Team | $199
Biffco | Team | -$72
Matsumura | Team | -$72
Biffco | Team | -$72

##### Offcanvas bottom

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

##### Backdrop

##### Colored with scrolling

Try scrolling the rest of the page to see this option in action.

#### Main Title

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

##### Offcanvas with backdrop

This is "Default behavior" of offcanvas.

#### Main Title

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

##### Backdroped with scrolling

Try scrolling the rest of the page to see this option in action.

#### Main Title

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

###### Some Title

Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.

##### Settings

- ###### Theme Mode

  Choose light or dark mode or Auto

- ###### Sidebar Theme

  Choose Sidebar Theme

- ###### Accent color

  Choose your primary theme color

- ###### Sidebar Caption

  Sidebar Caption Hide/Show

- ###### Theme Layout

  LTR/RTL

- ###### Layout Width

  Choose Full or Container Layout