Drawer Bottom 4 - Bottom drawer with snap points

Pro

Vaul drawer with multiple snap heights the user can drag between.

Shadcn Drawer Bottom 4 component

Component data

ID
drawer/drawer-bottom-4
Access
pro
Created
Oct 5, 2025
Type
example
Libraries
Radix UI, Base UI, React Aria

Drawer Bottom 4 component design & features

This drawer configures Vaul snap points so users drag between partial and expanded heights. DrawerContent resizes between stops, which supports peek-then-expand patterns for maps, players, or detail previews.

Snap points help music players, map detail cards, and product quick views where users want a peek before full expansion. They reduce commitment compared to opening a full-height sheet immediately.