Explore Components

Offcanvas

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

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

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

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

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

  • Theme Contrast

    Choose theme contrast

  • Custom Theme

    Choose your primary theme color

  • Sidebar Caption

    Sidebar Caption Hide/Show

  • Theme Layout

    LTR/RTL

  • Layout Width

    Choose Full or Container Layout