Vibe UI
Initializing Vibe UI System...
Vibe UI

Drawer

A highly interactive panel that slides in from any edge of the screen, supporting glassmorphism, neobrutalism, and glowing themes.

Drawer

A highly interactive panel that slides in from any edge of the screen, supporting glassmorphism, neobrutalism, and glowing themes.

Installation

pnpm dlx vibe-ui-kit@latest add drawer button
💡 Vibe UI Component Dependencies: This component requires other components to work correctlyPlease make sure you also install these Vibe UI component dependencies: button

Themes

Explore all style variants side-by-side.

Sides

Explore drawers sliding from different screen edges using the default variant.

Props

DrawerContent

PropTypeDefaultDescription
side'top' | 'bottom' | 'left' | 'right''right'The edge of the screen the drawer slides in from.
variant'default' | 'glass' | 'retro' | 'glow''default'The aesthetic variant styling theme to apply to the drawer content.

Contributors

JS
Jenish Sabhadiya

Theme Customizer

8px
@theme {
  --radius: 0.5rem;
  --glass-blur: 8px;
}
Changes apply instantly to this documentation workspace.
Drawer | Vibe UI