Drawers

Discover our drawer components, providing a hidden yet accessible space for navigation menus or additional information.

Basic Dark Backdrop

Drawer variant with a dark backdrop, providing a strong visual contrast.

Source code

The source code for BasicDarkBackdrop can be found at the following location, inside the downloaded package:

Live preview:

Basic Invisible Backdrop

Drawer with an invisible backdrop for a seamless integration with the page.

Source code

The source code for BasicInvisibleBackdrop can be found at the following location, inside the downloaded package:

Live preview:

Basic Light Backdrop

Standard drawer style with a light backdrop for subtle visual separation.

Source code

The source code for BasicLightBackdrop can be found at the following location, inside the downloaded package:

Live preview:

Dark

Drawer with a dark theme, offering a sleek and modern look.

Source code

The source code for Dark can be found at the following location, inside the downloaded package:

Live preview:

File Details

Drawer specifically designed to present file details or document information.

Source code

The source code for FileDetails can be found at the following location, inside the downloaded package:

Live preview:

Multi Column

Multi-column drawer for organizing content or navigation elements.

Source code

The source code for MultiColumn can be found at the following location, inside the downloaded package:

Live preview:

Notifications

Drawer component for displaying notifications and alerts in a compact space.

Source code

The source code for Notifications can be found at the following location, inside the downloaded package:

Live preview:

Widgets

Drawer featuring an outlined container, ideal for showing widgets data.

Source code

The source code for Widgets can be found at the following location, inside the downloaded package:

Live preview:

Positions

Drawer showcasing various positioning options for different UI contexts.

Source code

The source code for Positions can be found at the following location, inside the downloaded package:

Live preview:

Wide Form

A wide drawer variant, suitable for forms or extended content.

Source code

The source code for WideForm can be found at the following location, inside the downloaded package: