---
url: /components/dialogs/overview.md
description: >-
  Dialogs provide important prompts in a user flow. Use dialogs to make sure
  users act on information
---

# Dialogs

Dialogs provide important prompts in a user flow. Use dialogs to make sure users act on information

**Overview** · [Specs](specs.md) · [Guidelines](guidelines.md) · [Accessibility](accessibility.md)

![Dialogs](/assets/982ed86e-mrolg618-dialog.CxfylnxH.webp)

* Use dialogs to make sure users act on information
* Two variants: [basic](guidelines.md#97ac3858-3932-4084-ae8e-73e42b7cb752 "Basic dialogs interrupt users with urgent information, details, or actions. They're often used for alerts, quick selection, or confirmation.") and [full-screen](guidelines.md#007536b9-76b1-474a-a152-2f340caaff6f "Full-screen dialogs fill the entire screen, displaying actions that require a series of tasks to complete. They're often used for creating a calendar entry.")
* Should be dedicated to completing a single task
* Can also display information relevant to the task
* Commonly used to confirm high-risk actions like deleting progress

![Basic and full-screen dialog.](/assets/7e6280ed-ml9yk7iw-01.BF2iNWIJ.webp)

1. Basic dialog
2. Full-screen dialog

## Availability & resources

| Type | Resource | Status |
| --- | --- | --- |
| Design | [Design Kit (Figma)](https://www.figma.com/community/file/1035203688168086460) | Available |
| Implementation | [Flutter](https://api.flutter.dev/flutter/material/ThemeData/useMaterial3.html) | Available |
| Implementation | [Jetpack Compose](https://developer.android.com/develop/ui/compose/components/dialog) | Available |
| Implementation | [Android Views (MDC-Android)](https://github.com/material-components/material-components-android/blob/master/docs/components/Dialog.md) | Available |
| Implementation | [Web](https://github.com/material-components/material-web/blob/main/docs/components/dialog.md) | Available |

## Differences from M2

* Color: New color mappings and compatibility with [dynamic color](../../styles/color/dynamic/choosing-a-source.md "Dynamic color takes a single color from a user's wallpaper or in-app content and creates an accessible color scheme assigned to elements in the UI.")
* [Layout](../../foundations/layout/layout-overview/overview.md "Layout is the visual arrangement of elements on the screen."): Greater padding to account for the increased corner-radius and title size
* Position: Option for custom [basic dialog ](guidelines.md#97ac3858-3932-4084-ae8e-73e42b7cb752 "Basic dialogs interrupt users with urgent information, details, or actions. They're often used for alerts, quick selection, or confirmation.")positioning
* Shape: Increased corner-radius
* Typography: Larger and darker headline

![Basic dialog with rounded corner, larger headline.](/assets/41a287c4-ml9ykeuk-02.B_OG67DJ.webp)

New updates to color, layout, position, shape, and typography