---
title: "Dialog"
description: "Opens a dialog with the given content.

A dialog is a small window that prompts the user to make a decision or enter additional
information. A dialog does not fill the screen and is normally used for modal events that require
users to take an action before they can proceed.

The dialog is visible as long as it is part of the composition hierarchy. In order to let the
user dismiss the Dialog, the implementation of [onDismissRequest] should contain a way to remove
the dialog from the composition hierarchy."
type: "composable"
---

<div class='type'>Composable Function</div>


<a id='references'></a>

<div class='sourceset sourceset-common'>Common</div>


```kotlin
@Composable
expect fun Dialog(
    onDismissRequest: () -> Unit,
    properties: DialogProperties = DialogProperties(),
    content: @Composable () -> Unit,
)
```


Opens a dialog with the given content.

A dialog is a small window that prompts the user to make a decision or enter additional
information. A dialog does not fill the screen and is normally used for modal events that require
users to take an action before they can proceed.

The dialog is visible as long as it is part of the composition hierarchy. In order to let the
user dismiss the Dialog, the implementation of `onDismissRequest` should contain a way to remove
the dialog from the composition hierarchy.

#### Parameters

| | |
| --- | --- |
| onDismissRequest | Executes when the user tries to dismiss the dialog. |
| properties | `DialogProperties` for further customization of this dialog's behavior. |
| content | The content to be displayed inside the dialog. |




<div class='sourceset sourceset-android'>Android</div>


```kotlin
@Composable
actual fun Dialog(
    onDismissRequest: () -> Unit,
    properties: DialogProperties,
    content: @Composable () -> Unit,
)
```


Opens a dialog with the given content.

A dialog is a small window that prompts the user to make a decision or enter additional
information. A dialog does not fill the screen and is normally used for modal events that require
users to take an action before they can proceed.

The dialog is visible as long as it is part of the composition hierarchy. In order to let the
user dismiss the Dialog, the implementation of `onDismissRequest` should contain a way to remove
the dialog from the composition hierarchy.

#### Parameters

| | |
| --- | --- |
| onDismissRequest | Executes when the user tries to dismiss the dialog. |
| properties | `DialogProperties` for further customization of this dialog's behavior. |
| content | The content to be displayed inside the dialog. |





## Code Examples
### DialogSample
```kotlin
@Composable
fun DialogSample() {
    val openDialog = remember { mutableStateOf(true) }
    val dialogWidth = 200.dp
    val dialogHeight = 50.dp
    if (openDialog.value) {
        Dialog(onDismissRequest = { openDialog.value = false }) {
            // Draw a rectangle shape with rounded corners inside the dialog
            Box(Modifier.size(dialogWidth, dialogHeight).background(Color.White))
        }
    }
}
```

