components / Structure


Default Modal


Modals have four sizes depending on the width of content that needs to be displayed. Medium is the default size.

Scrolling Content

When the content of the modal is larger than the screen supports, it becomes scrollable with consistent spacing between the screen edge and the modal.

Non-closable Modals

For mandatory workflows and notifications, we can also remove the close functionality. The close button in the Modal Header does not appear and clicking on the backdrop doesn't do anything.