Drawers are modal panels that slide in from the edge of the screen, providing supplementary content without navigating away from the current page. They're ideal for navigation menus, filters, settings, and contextual information.

Basic Drawer

A basic temporary drawer that slides in from the left side of the screen.

Key Features

The Sistent Drawer component provides several powerful features:

Multiple Variants

Choose from temporary, persistent, or permanent drawer types to match your application's navigation needs and layout requirements.

Flexible Positioning

Anchor drawers to any edge of the screen (left, right, top, or bottom) to create the most intuitive user experience for your content.

Modal Overlay

Temporary drawers include an automatic backdrop overlay that focuses user attention and can be clicked to close the drawer.

Keyboard Support

Built-in accessibility features including keyboard navigation and Escape key support for closing drawers, ensuring a fully accessible interface.

Responsive Design

Drawers adapt seamlessly to different screen sizes, making them ideal for both mobile and desktop applications with consistent behavior.