Dialog overview

A dialog is a modal surface that interrupts the user's experience to focus attention on a decision, task, or critical information. The rest of the page is blocked until the dialog is dismissed.

Considerations

Focused

Dialogs focus the user on a single task or piece of critical information.

Sparing

Dialogs interrupt the experience. Overuse diminishes their impact and trains users to dismiss without reading.

Self-contained

Users should be able to make a decision using only the information inside the dialog. If they need to look elsewhere, reconsider the design.

Dialog types

Dialogs block the entire page. Choose the type that matches the level of commitment required from the user.

When to use an alert notice versus an alert dialog?