Svelte 5 Drawer – Side Sheet

Slide-in panel from left or right edge.

overlaysidebardrawer

Preview

Drawer

Use Case

Secondary actions, filtering, or details views.

Props API

Drawer component props
PropTypeDefaultDescription
open boolean—Visibility state
side 'left' | 'right''right'Drawer position

Related Components

Modal

See it in Action

Explore the Drawer in an interactive dashboard environment.

Customize in Showroom

More Layout Components

Panel

The Panel component groups related content with a consistent label style.

Toolbar

This control strip combines multiple input types into a cohesive unit, reducing visual noise while maximizing functionality.

Pagination

Designed to scale from 5 to 500 pages, this pagination component uses smart ellipsis logic to keep the UI compact while maintaining context.