diff --git a/src/components/buttons/ha-call-service-button.js b/src/components/buttons/ha-call-service-button.js
index cd229a772f..c8d7b79b56 100644
--- a/src/components/buttons/ha-call-service-button.js
+++ b/src/components/buttons/ha-call-service-button.js
@@ -3,7 +3,7 @@ import { PolymerElement } from "@polymer/polymer/polymer-element";
 
 import "./ha-progress-button";
 import { EventsMixin } from "../../mixins/events-mixin";
-import { showConfirmationDialog } from "../../dialogs/confirmation/show-dialog-confirmation";
+import { showConfirmationDialog } from "../../dialogs/generic/show-dialog-box";
 
 /*
  * @appliesMixin EventsMixin
diff --git a/src/dialogs/config-flow/step-flow-create-entry.ts b/src/dialogs/config-flow/step-flow-create-entry.ts
index 9fe62ffd2b..07cad8a94a 100644
--- a/src/dialogs/config-flow/step-flow-create-entry.ts
+++ b/src/dialogs/config-flow/step-flow-create-entry.ts
@@ -25,6 +25,7 @@ import {
 } from "../../data/area_registry";
 import { DataEntryFlowStepCreateEntry } from "../../data/data_entry_flow";
 import { FlowConfig } from "./show-dialog-data-entry-flow";
+import { showPromptDialog } from "../generic/show-dialog-box";
 
 @customElement("step-flow-create-entry")
 class StepFlowCreateEntry extends LitElement {
@@ -93,7 +94,7 @@ class StepFlowCreateEntry extends LitElement {
       <div class="buttons">
         ${this.devices.length > 0
           ? html`
-              <mwc-button @click="${this._addArea}"
+              <mwc-button @click="${this._promptAddArea}"
                 >${localize(
                   "ui.panel.config.integrations.config_flow.add_area"
                 )}</mwc-button
@@ -114,12 +115,7 @@ class StepFlowCreateEntry extends LitElement {
     fireEvent(this, "flow-update", { step: undefined });
   }
 
-  private async _addArea() {
-    const name = prompt(
-      this.hass.localize(
-        "ui.panel.config.integrations.config_flow.name_new_area"
-      )
-    );
+  private async _addArea(name?: string) {
     if (!name) {
       return;
     }
@@ -137,6 +133,18 @@ class StepFlowCreateEntry extends LitElement {
     }
   }
 
+  private async _promptAddArea() {
+    showPromptDialog(this, {
+      title: this.hass.localize(
+        "ui.panel.config.integrations.config_flow.name_new_area"
+      ),
+      inputLabel: this.hass.localize(
+        "ui.panel.config.integrations.config_flow.area_picker_label"
+      ),
+      confirm: (text) => this._addArea(text),
+    });
+  }
+
   private async _handleAreaChanged(ev: Event) {
     const dropdown = ev.currentTarget as any;
     const device = dropdown.device;
diff --git a/src/dialogs/confirmation/show-dialog-confirmation.ts b/src/dialogs/confirmation/show-dialog-confirmation.ts
deleted file mode 100644
index df57cf5558..0000000000
--- a/src/dialogs/confirmation/show-dialog-confirmation.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import { fireEvent } from "../../common/dom/fire_event";
-
-export interface ConfirmationDialogParams {
-  title?: string;
-  text: string;
-  confirmBtnText?: string;
-  cancelBtnText?: string;
-  confirm: () => void;
-}
-
-export const loadConfirmationDialog = () =>
-  import(/* webpackChunkName: "confirmation" */ "./dialog-confirmation");
-
-export const showConfirmationDialog = (
-  element: HTMLElement,
-  systemLogDetailParams: ConfirmationDialogParams
-): void => {
-  fireEvent(element, "show-dialog", {
-    dialogTag: "dialog-confirmation",
-    dialogImport: loadConfirmationDialog,
-    dialogParams: systemLogDetailParams,
-  });
-};
diff --git a/src/dialogs/confirmation/dialog-confirmation.ts b/src/dialogs/generic/dialog-box.ts
similarity index 51%
rename from src/dialogs/confirmation/dialog-confirmation.ts
rename to src/dialogs/generic/dialog-box.ts
index 2ef6003b54..0738239257 100644
--- a/src/dialogs/confirmation/dialog-confirmation.ts
+++ b/src/dialogs/generic/dialog-box.ts
@@ -14,17 +14,21 @@ import "../../components/dialog/ha-paper-dialog";
 import "../../components/ha-switch";
 
 import { HomeAssistant } from "../../types";
-import { ConfirmationDialogParams } from "./show-dialog-confirmation";
+import { DialogParams } from "./show-dialog-box";
 import { PolymerChangedEvent } from "../../polymer-types";
 import { haStyleDialog } from "../../resources/styles";
 
-@customElement("dialog-confirmation")
-class DialogConfirmation extends LitElement {
+@customElement("dialog-box")
+class DialogBox extends LitElement {
   @property() public hass!: HomeAssistant;
-  @property() private _params?: ConfirmationDialogParams;
+  @property() private _params?: DialogParams;
+  @property() private _value?: string;
 
-  public async showDialog(params: ConfirmationDialogParams): Promise<void> {
+  public async showDialog(params: DialogParams): Promise<void> {
     this._params = params;
+    if (params.prompt) {
+      this._value = params.defaultValue;
+    }
   }
 
   protected render(): TemplateResult | void {
@@ -32,6 +36,8 @@ class DialogConfirmation extends LitElement {
       return html``;
     }
 
+    const confirmPrompt = this._params.confirmation || this._params.prompt;
+
     return html`
       <ha-paper-dialog
         with-backdrop
@@ -42,33 +48,67 @@ class DialogConfirmation extends LitElement {
         <h2>
           ${this._params.title
             ? this._params.title
-            : this.hass.localize("ui.dialogs.confirmation.title")}
+            : this._params.confirmation &&
+              this.hass.localize(
+                "ui.dialogs.generic.default_confirmation_title"
+              )}
         </h2>
         <paper-dialog-scrollable>
-          <p>${this._params.text}</p>
+          ${this._params.text
+            ? html`
+                <p>${this._params.text}</p>
+              `
+            : ""}
+          ${this._params.prompt
+            ? html`
+                <paper-input
+                  autofocus
+                  .value=${this._value}
+                  @value-changed=${this._valueChanged}
+                  .label=${this._params.inputLabel
+                    ? this._params.inputLabel
+                    : ""}
+                  .type=${this._params.inputType
+                    ? this._params.inputType
+                    : "text"}
+                ></paper-input>
+              `
+            : ""}
         </paper-dialog-scrollable>
         <div class="paper-dialog-buttons">
-          <mwc-button @click="${this._dismiss}">
-            ${this._params.cancelBtnText
-              ? this._params.cancelBtnText
-              : this.hass.localize("ui.dialogs.confirmation.cancel")}
-          </mwc-button>
+          ${confirmPrompt &&
+            html`
+              <mwc-button @click="${this._dismiss}">
+                ${this._params.dismissText
+                  ? this._params.dismissText
+                  : this.hass.localize("ui.dialogs.generic.cancel")}
+              </mwc-button>
+            `}
           <mwc-button @click="${this._confirm}">
-            ${this._params.confirmBtnText
-              ? this._params.confirmBtnText
-              : this.hass.localize("ui.dialogs.confirmation.ok")}
+            ${this._params.confirmText
+              ? this._params.confirmText
+              : this.hass.localize("ui.dialogs.generic.ok")}
           </mwc-button>
         </div>
       </ha-paper-dialog>
     `;
   }
 
+  private _valueChanged(ev: PolymerChangedEvent<string>) {
+    this._value = ev.detail.value;
+  }
+
   private async _dismiss(): Promise<void> {
+    if (this._params!.cancel) {
+      this._params!.cancel();
+    }
     this._params = undefined;
   }
 
   private async _confirm(): Promise<void> {
-    this._params!.confirm();
+    if (this._params!.confirm) {
+      this._params!.confirm(this._value);
+    }
     this._dismiss();
   }
 
@@ -107,6 +147,6 @@ class DialogConfirmation extends LitElement {
 
 declare global {
   interface HTMLElementTagNameMap {
-    "dialog-confirmation": DialogConfirmation;
+    "dialog-box": DialogBox;
   }
 }
diff --git a/src/dialogs/generic/show-dialog-box.ts b/src/dialogs/generic/show-dialog-box.ts
new file mode 100644
index 0000000000..bd88af81b6
--- /dev/null
+++ b/src/dialogs/generic/show-dialog-box.ts
@@ -0,0 +1,62 @@
+import { fireEvent } from "../../common/dom/fire_event";
+
+interface AlertDialogParams {
+  confirmText?: string;
+  text?: string;
+  title?: string;
+  confirm?: (out?: string) => void;
+}
+
+interface ConfirmationDialogParams extends AlertDialogParams {
+  dismissText?: string;
+  cancel?: () => void;
+}
+
+interface PromptDialogParams extends AlertDialogParams {
+  inputLabel?: string;
+  inputType?: string;
+  defaultValue?: string;
+}
+
+export interface DialogParams
+  extends ConfirmationDialogParams,
+    PromptDialogParams {
+  confirmation?: boolean;
+  prompt?: boolean;
+}
+
+export const loadGenericDialog = () =>
+  import(/* webpackChunkName: "confirmation" */ "./dialog-box");
+
+export const showAlertDialog = (
+  element: HTMLElement,
+  dialogParams: AlertDialogParams
+): void => {
+  fireEvent(element, "show-dialog", {
+    dialogTag: "dialog-box",
+    dialogImport: loadGenericDialog,
+    dialogParams,
+  });
+};
+
+export const showConfirmationDialog = (
+  element: HTMLElement,
+  dialogParams: ConfirmationDialogParams
+): void => {
+  fireEvent(element, "show-dialog", {
+    dialogTag: "dialog-box",
+    dialogImport: loadGenericDialog,
+    dialogParams: { ...dialogParams, confirmation: true },
+  });
+};
+
+export const showPromptDialog = (
+  element: HTMLElement,
+  dialogParams: PromptDialogParams
+): void => {
+  fireEvent(element, "show-dialog", {
+    dialogTag: "dialog-box",
+    dialogImport: loadGenericDialog,
+    dialogParams: { ...dialogParams, prompt: true },
+  });
+};
diff --git a/src/dialogs/more-info/more-info-controls.js b/src/dialogs/more-info/more-info-controls.js
index 65c24a5846..c4ff5e4f6f 100644
--- a/src/dialogs/more-info/more-info-controls.js
+++ b/src/dialogs/more-info/more-info-controls.js
@@ -21,7 +21,7 @@ import { EventsMixin } from "../../mixins/events-mixin";
 import LocalizeMixin from "../../mixins/localize-mixin";
 import { computeRTL } from "../../common/util/compute_rtl";
 import { removeEntityRegistryEntry } from "../../data/entity_registry";
-import { showConfirmationDialog } from "../confirmation/show-dialog-confirmation";
+import { showConfirmationDialog } from "../generic/show-dialog-box";
 import { showEntityRegistryDetailDialog } from "../../panels/config/entities/show-dialog-entity-registry-detail";
 
 const DOMAINS_NO_INFO = ["camera", "configurator", "history_graph"];
@@ -252,8 +252,8 @@ class MoreInfoControls extends LocalizeMixin(EventsMixin(PolymerElement)) {
       text: this.localize(
         "ui.dialogs.more_info_control.restored.confirm_remove_text"
       ),
-      confirmBtnText: this.localize("ui.common.yes"),
-      cancelBtnText: this.localize("ui.common.no"),
+      confirmText: this.localize("ui.common.yes"),
+      dismissText: this.localize("ui.common.no"),
       confirm: () =>
         removeEntityRegistryEntry(this.hass, this.stateObj.entity_id),
     });
diff --git a/src/panels/config/automation/ha-automation-editor.ts b/src/panels/config/automation/ha-automation-editor.ts
index 51980e7c88..832d9116ea 100644
--- a/src/panels/config/automation/ha-automation-editor.ts
+++ b/src/panels/config/automation/ha-automation-editor.ts
@@ -25,7 +25,10 @@ import {
   Trigger,
 } from "../../../data/automation";
 import { Action } from "../../../data/script";
-import { showConfirmationDialog } from "../../../dialogs/confirmation/show-dialog-confirmation";
+import {
+  showAlertDialog,
+  showConfirmationDialog,
+} from "../../../dialogs/generic/show-dialog-box";
 import "../../../layouts/ha-app-layout";
 import { haStyle } from "../../../resources/styles";
 import { HomeAssistant } from "../../../types";
@@ -65,7 +68,7 @@ export class HaAutomationEditor extends LitElement {
                       "ui.panel.config.automation.picker.delete_automation"
                     )}"
                     icon="hass:delete"
-                    @click=${this._delete}
+                    @click=${this._deleteConfirm}
                   ></paper-icon-button>
                 `}
           </app-toolbar>
@@ -252,17 +255,18 @@ export class HaAutomationEditor extends LitElement {
             this._config = config;
           },
           (resp) => {
-            alert(
-              resp.status_code === 404
-                ? this.hass.localize(
-                    "ui.panel.config.automation.editor.load_error_not_editable"
-                  )
-                : this.hass.localize(
-                    "ui.panel.config.automation.editor.load_error_unknown",
-                    "err_no",
-                    resp.status_code
-                  )
-            );
+            showAlertDialog(this, {
+              text:
+                resp.status_code === 404
+                  ? this.hass.localize(
+                      "ui.panel.config.automation.editor.load_error_not_editable"
+                    )
+                  : this.hass.localize(
+                      "ui.panel.config.automation.editor.load_error_unknown",
+                      "err_no",
+                      resp.status_code
+                    ),
+            });
             history.back();
           }
         );
@@ -326,8 +330,8 @@ export class HaAutomationEditor extends LitElement {
         text: this.hass!.localize(
           "ui.panel.config.automation.editor.unsaved_confirm"
         ),
-        confirmBtnText: this.hass!.localize("ui.common.yes"),
-        cancelBtnText: this.hass!.localize("ui.common.no"),
+        confirmText: this.hass!.localize("ui.common.yes"),
+        dismissText: this.hass!.localize("ui.common.no"),
         confirm: () => history.back(),
       });
     } else {
@@ -335,14 +339,18 @@ export class HaAutomationEditor extends LitElement {
     }
   }
 
+  private async _deleteConfirm() {
+    showConfirmationDialog(this, {
+      text: this.hass.localize(
+        "ui.panel.config.automation.picker.delete_confirm"
+      ),
+      confirmText: this.hass!.localize("ui.common.yes"),
+      dismissText: this.hass!.localize("ui.common.no"),
+      confirm: () => this._delete(),
+    });
+  }
+
   private async _delete() {
-    if (
-      !confirm(
-        this.hass.localize("ui.panel.config.automation.picker.delete_confirm")
-      )
-    ) {
-      return;
-    }
     await deleteAutomation(this.hass, this.automation.attributes.id!);
     history.back();
   }
diff --git a/src/panels/config/entities/entity-registry-settings.ts b/src/panels/config/entities/entity-registry-settings.ts
index 6806f5c6d1..24540bb38b 100644
--- a/src/panels/config/entities/entity-registry-settings.ts
+++ b/src/panels/config/entities/entity-registry-settings.ts
@@ -25,7 +25,7 @@ import {
   removeEntityRegistryEntry,
   EntityRegistryEntry,
 } from "../../../data/entity_registry";
-import { showConfirmationDialog } from "../../../dialogs/confirmation/show-dialog-confirmation";
+import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box";
 import { fireEvent } from "../../../common/dom/fire_event";
 
 @customElement("entity-registry-settings")
diff --git a/src/panels/config/entities/ha-config-entities.ts b/src/panels/config/entities/ha-config-entities.ts
index ea9fdd0b2e..ae39bd03a2 100644
--- a/src/panels/config/entities/ha-config-entities.ts
+++ b/src/panels/config/entities/ha-config-entities.ts
@@ -45,7 +45,7 @@ import {
   HaDataTable,
   DataTableColumnData,
 } from "../../../components/data-table/ha-data-table";
-import { showConfirmationDialog } from "../../../dialogs/confirmation/show-dialog-confirmation";
+import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box";
 import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
 import { DialogEntityRegistryDetail } from "./dialog-entity-registry-detail";
 
@@ -410,8 +410,8 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
       text: this.hass.localize(
         "ui.panel.config.entities.picker.enable_selected.confirm_text"
       ),
-      confirmBtnText: this.hass.localize("ui.common.yes"),
-      cancelBtnText: this.hass.localize("ui.common.no"),
+      confirmText: this.hass.localize("ui.common.yes"),
+      dismissText: this.hass.localize("ui.common.no"),
       confirm: () => {
         this._selectedEntities.forEach((entity) =>
           updateEntityRegistryEntry(this.hass, entity, {
@@ -433,8 +433,8 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
       text: this.hass.localize(
         "ui.panel.config.entities.picker.disable_selected.confirm_text"
       ),
-      confirmBtnText: this.hass.localize("ui.common.yes"),
-      cancelBtnText: this.hass.localize("ui.common.no"),
+      confirmText: this.hass.localize("ui.common.yes"),
+      dismissText: this.hass.localize("ui.common.no"),
       confirm: () => {
         this._selectedEntities.forEach((entity) =>
           updateEntityRegistryEntry(this.hass, entity, {
@@ -460,8 +460,8 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
       text: this.hass.localize(
         "ui.panel.config.entities.picker.remove_selected.confirm_text"
       ),
-      confirmBtnText: this.hass.localize("ui.common.yes"),
-      cancelBtnText: this.hass.localize("ui.common.no"),
+      confirmText: this.hass.localize("ui.common.yes"),
+      dismissText: this.hass.localize("ui.common.no"),
       confirm: () => {
         removeableEntities.forEach((entity) =>
           removeEntityRegistryEntry(this.hass, entity)
diff --git a/src/panels/config/integrations/config-entry/ha-config-entry-page.ts b/src/panels/config/integrations/config-entry/ha-config-entry-page.ts
index 3dc2dbb3b6..bc2923aed4 100755
--- a/src/panels/config/integrations/config-entry/ha-config-entry-page.ts
+++ b/src/panels/config/integrations/config-entry/ha-config-entry-page.ts
@@ -17,7 +17,10 @@ import { DeviceRegistryEntry } from "../../../../data/device_registry";
 import { AreaRegistryEntry } from "../../../../data/area_registry";
 import { fireEvent } from "../../../../common/dom/fire_event";
 import { showConfigEntrySystemOptionsDialog } from "../../../../dialogs/config-entry-system-options/show-dialog-config-entry-system-options";
-import { showConfirmationDialog } from "../../../../dialogs/confirmation/show-dialog-confirmation";
+import {
+  showAlertDialog,
+  showConfirmationDialog,
+} from "../../../../dialogs/generic/show-dialog-box";
 
 class HaConfigEntryPage extends LitElement {
   @property() public hass!: HomeAssistant;
@@ -177,11 +180,11 @@ class HaConfigEntryPage extends LitElement {
     deleteConfigEntry(this.hass, this.configEntryId).then((result) => {
       fireEvent(this, "hass-reload-entries");
       if (result.require_restart) {
-        alert(
-          this.hass.localize(
+        showAlertDialog(this, {
+          text: this.hass.localize(
             "ui.panel.config.integrations.config_entry.restart_confirm"
-          )
-        );
+          ),
+        });
       }
       navigate(this, "/config/integrations/dashboard", true);
     });
diff --git a/src/panels/config/integrations/ha-config-entries-dashboard.ts b/src/panels/config/integrations/ha-config-entries-dashboard.ts
index 66fcb0a940..c846648e96 100644
--- a/src/panels/config/integrations/ha-config-entries-dashboard.ts
+++ b/src/panels/config/integrations/ha-config-entries-dashboard.ts
@@ -43,7 +43,7 @@ import { ConfigEntry, deleteConfigEntry } from "../../../data/config_entries";
 import { fireEvent } from "../../../common/dom/fire_event";
 import { EntityRegistryEntry } from "../../../data/entity_registry";
 import { DataEntryFlowProgress } from "../../../data/data_entry_flow";
-import { showConfirmationDialog } from "../../../dialogs/confirmation/show-dialog-confirmation";
+import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box";
 
 @customElement("ha-config-entries-dashboard")
 export class HaConfigManagerDashboard extends LitElement {
@@ -277,7 +277,7 @@ export class HaConfigManagerDashboard extends LitElement {
       text: this.hass!.localize(
         "ui.panel.config.integrations.ignore.confirm_ignore"
       ),
-      confirmBtnText: this.hass!.localize(
+      confirmText: this.hass!.localize(
         "ui.panel.config.integrations.ignore.ignore"
       ),
       confirm: () => {
@@ -302,7 +302,7 @@ export class HaConfigManagerDashboard extends LitElement {
       text: this.hass!.localize(
         "ui.panel.config.integrations.ignore.confirm_delete_ignore"
       ),
-      confirmBtnText: this.hass!.localize(
+      confirmText: this.hass!.localize(
         "ui.panel.config.integrations.ignore.stop_ignore"
       ),
       confirm: async () => {
diff --git a/src/panels/config/scene/ha-scene-editor.ts b/src/panels/config/scene/ha-scene-editor.ts
index 9e1e232a72..02536b87a6 100644
--- a/src/panels/config/scene/ha-scene-editor.ts
+++ b/src/panels/config/scene/ha-scene-editor.ts
@@ -54,7 +54,7 @@ import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
 import memoizeOne from "memoize-one";
 import { computeDomain } from "../../../common/entity/compute_domain";
 import { HassEvent } from "home-assistant-js-websocket";
-import { showConfirmationDialog } from "../../../dialogs/confirmation/show-dialog-confirmation";
+import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box";
 
 interface DeviceEntities {
   id: string;
@@ -560,8 +560,8 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
         text: this.hass!.localize(
           "ui.panel.config.scene.editor.unsaved_confirm"
         ),
-        confirmBtnText: this.hass!.localize("ui.common.yes"),
-        cancelBtnText: this.hass!.localize("ui.common.no"),
+        confirmText: this.hass!.localize("ui.common.yes"),
+        dismissText: this.hass!.localize("ui.common.no"),
         confirm: () => this._goBack(),
       });
     } else {
@@ -577,8 +577,8 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
   private _deleteTapped(): void {
     showConfirmationDialog(this, {
       text: this.hass!.localize("ui.panel.config.scene.picker.delete_confirm"),
-      confirmBtnText: this.hass!.localize("ui.common.yes"),
-      cancelBtnText: this.hass!.localize("ui.common.no"),
+      confirmText: this.hass!.localize("ui.common.yes"),
+      dismissText: this.hass!.localize("ui.common.no"),
       confirm: () => this._delete(),
     });
   }
diff --git a/src/panels/config/script/ha-script-editor.ts b/src/panels/config/script/ha-script-editor.ts
index 9787783706..bdf8e7a92b 100644
--- a/src/panels/config/script/ha-script-editor.ts
+++ b/src/panels/config/script/ha-script-editor.ts
@@ -22,7 +22,7 @@ import {
   ScriptConfig,
   deleteScript,
 } from "../../../data/script";
-import { showConfirmationDialog } from "../../../dialogs/confirmation/show-dialog-confirmation";
+import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box";
 import "../../../layouts/ha-app-layout";
 import { haStyle } from "../../../resources/styles";
 import { HomeAssistant } from "../../../types";
@@ -61,7 +61,7 @@ export class HaScriptEditor extends LitElement {
                       "ui.panel.config.script.editor.delete_script"
                     )}"
                     icon="hass:delete"
-                    @click=${this._delete}
+                    @click=${this._deleteConfirm}
                   ></paper-icon-button>
                 `}
           </app-toolbar>
@@ -228,8 +228,8 @@ export class HaScriptEditor extends LitElement {
         text: this.hass!.localize(
           "ui.panel.config.common.editor.confirm_unsaved"
         ),
-        confirmBtnText: this.hass!.localize("ui.common.yes"),
-        cancelBtnText: this.hass!.localize("ui.common.no"),
+        confirmText: this.hass!.localize("ui.common.yes"),
+        dismissText: this.hass!.localize("ui.common.no"),
         confirm: () => history.back(),
       });
     } else {
@@ -237,14 +237,16 @@ export class HaScriptEditor extends LitElement {
     }
   }
 
+  private async _deleteConfirm() {
+    showConfirmationDialog(this, {
+      text: this.hass.localize("ui.panel.config.script.editor.delete_confirm"),
+      confirmText: this.hass!.localize("ui.common.yes"),
+      dismissText: this.hass!.localize("ui.common.no"),
+      confirm: () => this._delete(),
+    });
+  }
+
   private async _delete() {
-    if (
-      !confirm(
-        this.hass.localize("ui.panel.config.script.editor.delete_confirm")
-      )
-    ) {
-      return;
-    }
     await deleteScript(this.hass, computeObjectId(this.script.entity_id));
     history.back();
   }
diff --git a/src/panels/config/users/ha-user-editor.ts b/src/panels/config/users/ha-user-editor.ts
index f45f8a08c5..344a5a462e 100644
--- a/src/panels/config/users/ha-user-editor.ts
+++ b/src/panels/config/users/ha-user-editor.ts
@@ -24,6 +24,11 @@ import {
   SYSTEM_GROUP_ID_ADMIN,
 } from "../../../data/user";
 import { showSaveSuccessToast } from "../../../util/toast-saved-success";
+import {
+  showAlertDialog,
+  showConfirmationDialog,
+  showPromptDialog,
+} from "../../../dialogs/generic/show-dialog-box";
 
 declare global {
   interface HASSDomEvents {
@@ -106,12 +111,12 @@ class HaUserEditor extends LitElement {
           </table>
 
           <div class="card-actions">
-            <mwc-button @click=${this._handleRenameUser}>
+            <mwc-button @click=${this._handlePromptRenameUser}>
               ${hass.localize("ui.panel.config.users.editor.rename_user")}
             </mwc-button>
             <mwc-button
               class="warning"
-              @click=${this._deleteUser}
+              @click=${this._promptDeleteUser}
               .disabled=${user.system_generated}
             >
               ${hass.localize("ui.panel.config.users.editor.delete_user")}
@@ -137,12 +142,7 @@ class HaUserEditor extends LitElement {
     );
   }
 
-  private async _handleRenameUser(ev): Promise<void> {
-    ev.currentTarget.blur();
-    const newName = prompt(
-      this.hass!.localize("ui.panel.config.users.editor.enter_new_name"),
-      this.user!.name
-    );
+  private async _handleRenameUser(newName?: string) {
     if (newName === null || newName === this.user!.name) {
       return;
     }
@@ -153,14 +153,24 @@ class HaUserEditor extends LitElement {
       });
       fireEvent(this, "reload-users");
     } catch (err) {
-      alert(
-        `${this.hass!.localize(
+      showAlertDialog(this, {
+        text: `${this.hass!.localize(
           "ui.panel.config.users.editor.user_rename_failed"
-        )} ${err.message}`
-      );
+        )} ${err.message}`,
+      });
     }
   }
 
+  private async _handlePromptRenameUser(ev): Promise<void> {
+    ev.currentTarget.blur();
+    showPromptDialog(this, {
+      title: this.hass!.localize("ui.panel.config.users.editor.enter_new_name"),
+      defaultValue: this.user!.name,
+      inputLabel: this.hass!.localize("ui.panel.config.users.add_user.name"),
+      confirm: (text) => this._handleRenameUser(text),
+    });
+  }
+
   private async _handleGroupChange(ev): Promise<void> {
     const selectEl = ev.currentTarget as HTMLSelectElement;
     const newGroup = selectEl.value;
@@ -171,38 +181,39 @@ class HaUserEditor extends LitElement {
       showSaveSuccessToast(this, this.hass!);
       fireEvent(this, "reload-users");
     } catch (err) {
-      alert(
-        `${this.hass!.localize(
+      showAlertDialog(this, {
+        text: `${this.hass!.localize(
           "ui.panel.config.users.editor.group_update_failed"
-        )} ${err.message}`
-      );
+        )} ${err.message}`,
+      });
       selectEl.value = this.user!.group_ids[0];
     }
   }
 
-  private async _deleteUser(ev): Promise<void> {
-    if (
-      !confirm(
-        this.hass!.localize(
-          "ui.panel.config.users.editor.confirm_user_deletion",
-          "name",
-          this._name
-        )
-      )
-    ) {
-      ev.target.blur();
-      return;
-    }
+  private async _deleteUser() {
     try {
       await deleteUser(this.hass!, this.user!.id);
     } catch (err) {
-      alert(err.code);
+      showAlertDialog(this, {
+        text: err.code,
+      });
       return;
     }
     fireEvent(this, "reload-users");
     navigate(this, "/config/users");
   }
 
+  private async _promptDeleteUser(_ev): Promise<void> {
+    showConfirmationDialog(this, {
+      text: this.hass!.localize(
+        "ui.panel.config.users.editor.confirm_user_deletion",
+        "name",
+        this._name
+      ),
+      confirm: () => this._deleteUser(),
+    });
+  }
+
   static get styles(): CSSResultArray {
     return [
       haStyle,
diff --git a/src/panels/developer-tools/event/developer-tools-event.js b/src/panels/developer-tools/event/developer-tools-event.js
index 074fcb6851..5ec02485da 100644
--- a/src/panels/developer-tools/event/developer-tools-event.js
+++ b/src/panels/developer-tools/event/developer-tools-event.js
@@ -12,6 +12,7 @@ import "./events-list";
 import "./event-subscribe-card";
 import { EventsMixin } from "../../../mixins/events-mixin";
 import LocalizeMixin from "../../../mixins/localize-mixin";
+import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box";
 
 const ERROR_SENTINEL = {};
 /*
@@ -154,11 +155,11 @@ class HaPanelDevEvent extends EventsMixin(LocalizeMixin(PolymerElement)) {
 
   fireEvent() {
     if (!this.eventType) {
-      alert(
-        this.hass.localize(
+      showAlertDialog(this, {
+        text: this.hass.localize(
           "ui.panel.developer-tools.tabs.events.alert_event_type"
-        )
-      );
+        ),
+      });
       return;
     }
     this.hass.callApi("POST", "events/" + this.eventType, this.parsedJSON).then(
diff --git a/src/panels/developer-tools/service/developer-tools-service.js b/src/panels/developer-tools/service/developer-tools-service.js
index b9bb843422..f4a057f910 100644
--- a/src/panels/developer-tools/service/developer-tools-service.js
+++ b/src/panels/developer-tools/service/developer-tools-service.js
@@ -11,6 +11,7 @@ import "../../../components/ha-service-picker";
 import "../../../resources/ha-style";
 import "../../../util/app-localstorage-document";
 import LocalizeMixin from "../../../mixins/localize-mixin";
+import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box";
 
 const ERROR_SENTINEL = {};
 /*
@@ -290,14 +291,13 @@ class HaPanelDevService extends LocalizeMixin(PolymerElement) {
 
   _callService() {
     if (this.parsedJSON === ERROR_SENTINEL) {
-      // eslint-disable-next-line
-      alert(
-        this.hass.localize(
+      showAlertDialog(this, {
+        text: this.hass.localize(
           "ui.panel.developer-tools.tabs.services.alert_parsing_yaml",
           "data",
           this.serviceData
-        )
-      );
+        ),
+      });
       return;
     }
 
diff --git a/src/panels/developer-tools/state/developer-tools-state.js b/src/panels/developer-tools/state/developer-tools-state.js
index 8312f15e34..9cc5fb6bc8 100644
--- a/src/panels/developer-tools/state/developer-tools-state.js
+++ b/src/panels/developer-tools/state/developer-tools-state.js
@@ -11,6 +11,7 @@ import "../../../components/ha-code-editor";
 import "../../../resources/ha-style";
 import { EventsMixin } from "../../../mixins/events-mixin";
 import LocalizeMixin from "../../../mixins/localize-mixin";
+import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box";
 
 const ERROR_SENTINEL = {};
 /*
@@ -257,11 +258,11 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
 
   handleSetState() {
     if (!this._entityId) {
-      alert(
-        this.hass.localize(
+      showAlertDialog(this, {
+        text: this.hass.localize(
           "ui.panel.developer-tools.tabs.states.alert_entity_field"
-        )
-      );
+        ),
+      });
       return;
     }
     this.hass.callApi("POST", "states/" + this._entityId, {
diff --git a/src/panels/lovelace/editor/delete-card.ts b/src/panels/lovelace/editor/delete-card.ts
index 0a84fb542a..0d7baad0f5 100644
--- a/src/panels/lovelace/editor/delete-card.ts
+++ b/src/panels/lovelace/editor/delete-card.ts
@@ -1,6 +1,9 @@
 import { Lovelace } from "../types";
 import { deleteCard } from "./config-util";
-import { showConfirmationDialog } from "../../../dialogs/confirmation/show-dialog-confirmation";
+import {
+  showAlertDialog,
+  showConfirmationDialog,
+} from "../../../dialogs/generic/show-dialog-box";
 import { HomeAssistant } from "../../../types";
 
 export async function confDeleteCard(
@@ -15,7 +18,9 @@ export async function confDeleteCard(
       try {
         await lovelace.saveConfig(deleteCard(lovelace.config, path));
       } catch (err) {
-        alert(`Deleting failed: ${err.message}`);
+        showAlertDialog(element, {
+          text: `Deleting failed: ${err.message}`,
+        });
       }
     },
   });
diff --git a/src/panels/lovelace/editor/view-editor/hui-edit-view.ts b/src/panels/lovelace/editor/view-editor/hui-edit-view.ts
index 223d9fd0c8..b8d6cfdda1 100644
--- a/src/panels/lovelace/editor/view-editor/hui-edit-view.ts
+++ b/src/panels/lovelace/editor/view-editor/hui-edit-view.ts
@@ -34,7 +34,10 @@ import { processEditorEntities } from "../process-editor-entities";
 import { navigate } from "../../../../common/navigate";
 import { Lovelace } from "../../types";
 import { deleteView, addView, replaceView } from "../config-util";
-import { showConfirmationDialog } from "../../../../dialogs/confirmation/show-dialog-confirmation";
+import {
+  showAlertDialog,
+  showConfirmationDialog,
+} from "../../../../dialogs/generic/show-dialog-box";
 
 @customElement("hui-edit-view")
 export class HuiEditView extends LitElement {
@@ -179,13 +182,17 @@ export class HuiEditView extends LitElement {
       this._closeDialog();
       navigate(this, `/lovelace/0`);
     } catch (err) {
-      alert(`Deleting failed: ${err.message}`);
+      showAlertDialog(this, {
+        text: `Deleting failed: ${err.message}`,
+      });
     }
   }
 
   private _deleteConfirm(): void {
     if (this._cards && this._cards.length > 0) {
-      alert(this.hass!.localize("ui.panel.lovelace.views.existing_cards"));
+      showAlertDialog(this, {
+        text: this.hass!.localize("ui.panel.lovelace.views.existing_cards"),
+      });
       return;
     }
 
@@ -243,7 +250,9 @@ export class HuiEditView extends LitElement {
       );
       this._closeDialog();
     } catch (err) {
-      alert(`Saving failed: ${err.message}`);
+      showAlertDialog(this, {
+        text: `Saving failed: ${err.message}`,
+      });
     } finally {
       this._saving = false;
     }
diff --git a/src/panels/lovelace/hui-editor.ts b/src/panels/lovelace/hui-editor.ts
index a82154550b..a226240285 100644
--- a/src/panels/lovelace/hui-editor.ts
+++ b/src/panels/lovelace/hui-editor.ts
@@ -29,7 +29,10 @@ import { HaCodeEditor } from "../../components/ha-code-editor";
 import { HomeAssistant } from "../../types";
 import { computeRTL } from "../../common/util/compute_rtl";
 import { LovelaceConfig } from "../../data/lovelace";
-import { showConfirmationDialog } from "../../dialogs/confirmation/show-dialog-confirmation";
+import {
+  showAlertDialog,
+  showConfirmationDialog,
+} from "../../dialogs/generic/show-dialog-box";
 
 const lovelaceStruct = struct.interface({
   title: "string?",
@@ -213,8 +216,8 @@ class LovelaceFullConfigEditor extends LitElement {
         text: this.hass.localize(
           "ui.panel.lovelace.editor.raw_editor.confirm_remove_config_text"
         ),
-        confirmBtnText: this.hass.localize("ui.common.yes"),
-        cancelBtnText: this.hass.localize("ui.common.no"),
+        confirmText: this.hass.localize("ui.common.yes"),
+        dismissText: this.hass.localize("ui.common.no"),
         confirm: () => this._removeConfig(),
       });
       return;
@@ -236,38 +239,38 @@ class LovelaceFullConfigEditor extends LitElement {
     try {
       config = safeLoad(value);
     } catch (err) {
-      alert(
-        this.hass.localize(
+      showAlertDialog(this, {
+        text: this.hass.localize(
           "ui.panel.lovelace.editor.raw_editor.error_parse_yaml",
           "error",
           err
-        )
-      );
+        ),
+      });
       this._saving = false;
       return;
     }
     try {
       config = lovelaceStruct(config);
     } catch (err) {
-      alert(
-        this.hass.localize(
+      showAlertDialog(this, {
+        text: this.hass.localize(
           "ui.panel.lovelace.editor.raw_editor.error_invalid_config",
           "error",
           err
-        )
-      );
+        ),
+      });
       return;
     }
     try {
       await this.lovelace!.saveConfig(config);
     } catch (err) {
-      alert(
-        this.hass.localize(
+      showAlertDialog(this, {
+        text: this.hass.localize(
           "ui.panel.lovelace.editor.raw_editor.error_save_yaml",
           "error",
           err
-        )
-      );
+        ),
+      });
     }
     this._generation = this.yamlEditor
       .codemirror!.getDoc()
diff --git a/src/panels/lovelace/hui-root.ts b/src/panels/lovelace/hui-root.ts
index c59b17a4f4..296c86c57f 100644
--- a/src/panels/lovelace/hui-root.ts
+++ b/src/panels/lovelace/hui-root.ts
@@ -50,6 +50,7 @@ import { computeRTLDirection } from "../../common/util/compute_rtl";
 import { loadLovelaceResources } from "./common/load-resources";
 import { showVoiceCommandDialog } from "../../dialogs/voice-command-dialog/show-ha-voice-command-dialog";
 import { isComponentLoaded } from "../../common/config/is_component_loaded";
+import { showAlertDialog } from "../../dialogs/generic/show-dialog-box";
 import memoizeOne from "memoize-one";
 
 class HUIRoot extends LitElement {
@@ -580,7 +581,9 @@ class HUIRoot extends LitElement {
 
   private _editModeEnable(): void {
     if (this._yamlMode) {
-      window.alert("The edit UI is not available when in YAML mode.");
+      showAlertDialog(this, {
+        text: "The edit UI is not available when in YAML mode.",
+      });
       return;
     }
     this.lovelace!.setEditMode(true);
diff --git a/src/panels/profile/ha-long-lived-access-tokens-card.js b/src/panels/profile/ha-long-lived-access-tokens-card.js
index fb41469405..68244c8d36 100644
--- a/src/panels/profile/ha-long-lived-access-tokens-card.js
+++ b/src/panels/profile/ha-long-lived-access-tokens-card.js
@@ -10,6 +10,7 @@ import "../../components/ha-card";
 import "../../resources/ha-style";
 
 import "./ha-settings-row";
+import { showAlertDialog } from "../../dialogs/generic/show-dialog-box";
 
 /*
  * @appliesMixin EventsMixin
@@ -121,9 +122,11 @@ class HaLongLivedTokens extends LocalizeMixin(EventsMixin(PolymerElement)) {
     } catch (err) {
       // eslint-disable-next-line
       console.error(err);
-      alert(
-        this.localize("ui.panel.profile.long_lived_access_tokens.create_failed")
-      );
+      showAlertDialog(this, {
+        text: this.localize(
+          "ui.panel.profile.long_lived_access_tokens.create_failed"
+        ),
+      });
     }
   }
 
@@ -148,9 +151,11 @@ class HaLongLivedTokens extends LocalizeMixin(EventsMixin(PolymerElement)) {
     } catch (err) {
       // eslint-disable-next-line
       console.error(err);
-      alert(
-        this.localize("ui.panel.profile.long_lived_access_tokens.delete_failed")
-      );
+      showAlertDialog(this, {
+        text: this.localize(
+          "ui.panel.profile.long_lived_access_tokens.delete_failed"
+        ),
+      });
     }
   }
 }
diff --git a/src/panels/profile/ha-panel-profile.ts b/src/panels/profile/ha-panel-profile.ts
index 69a6d85c74..11597415d9 100644
--- a/src/panels/profile/ha-panel-profile.ts
+++ b/src/panels/profile/ha-panel-profile.ts
@@ -35,7 +35,7 @@ import { haStyle } from "../../resources/styles";
 import { HomeAssistant } from "../../types";
 import { fireEvent } from "../../common/dom/fire_event";
 import { UnsubscribeFunc } from "home-assistant-js-websocket";
-import { showConfirmationDialog } from "../../dialogs/confirmation/show-dialog-confirmation";
+import { showConfirmationDialog } from "../../dialogs/generic/show-dialog-box";
 
 class HaPanelProfile extends LitElement {
   @property() public hass!: HomeAssistant;
@@ -175,7 +175,7 @@ class HaPanelProfile extends LitElement {
     showConfirmationDialog(this, {
       title: this.hass.localize("ui.panel.profile.logout_title"),
       text: this.hass.localize("ui.panel.profile.logout_text"),
-      confirmBtnText: this.hass.localize("ui.panel.profile.logout"),
+      confirmText: this.hass.localize("ui.panel.profile.logout"),
       confirm: () => fireEvent(this, "hass-logout"),
     });
   }
diff --git a/src/translations/en.json b/src/translations/en.json
index d0ed95965e..a12d2c0944 100755
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -577,10 +577,10 @@
         "label": "Type a question and press 'Enter'",
         "label_voice": "Type and press 'Enter' or tap the microphone to speak"
       },
-      "confirmation": {
+      "generic": {
         "cancel": "Cancel",
         "ok": "OK",
-        "title": "Are you sure?"
+        "default_confirmation_title": "Are you sure?"
       },
       "more_info_control": {
         "dismiss": "Dismiss dialog",