A dialog is a modal used to inform users about a task. It can contain critical information, require decisions, or involve multiple tasks.

Dialogs are meant to be interruptive and appear in front of content, disabling all app functionality until confirmed, dismissed, or a required action has been taken.

• Default: Used for all dialogs that don't pose a risk and are just a confirmation
• Alert: Used for actions that entail crucial changes such as deleting

Anatomy

Dialogs consist of a header, body, footer and elevation each with their own sub-elements. Dialogs are based on the card component and can be extended in functionality adding subtitles and dividers, though it is recommended to keep this element simple and concise.

A. Header

1. Title

B. Body

3. Content (optional)

C. Footer 4. Secondary action (optional) 5. Primary action