Drawer Component

Capsule-styled slide-out drawers with crisp borders and smooth animations.

Direction Variants

Drawers can slide in from any direction. Try all four directions below.

A side drawer with header, content, and footer for profile management.

A settings drawer with toggles and preferences.

A filter drawer for e-commerce or listings.

A side drawer for reviewing cart items before checkout.

A side panel for previewing product details.

The root component that manages open state and direction.