Skip to content
Atelier

Drawer

A drawer component for React.
Default
Usage notes
  • Use for secondary flows that benefit from more vertical space.
  • Keep the header concise and action-oriented.
  • Confirm important actions before dismiss.
Responsive dialog
Usage notes
  • Use a dialog on desktop for focused edits.
  • Swap to a drawer on mobile to preserve context.
  • Keep fields and copy consistent across breakpoints.