diff --git a/src/data/core.ts b/src/data/core.ts
index a2b944e3bdcb..889db332a827 100644
--- a/src/data/core.ts
+++ b/src/data/core.ts
@@ -18,6 +18,7 @@ export interface ConfigUpdateValues {
 export interface CheckConfigResult {
   result: "valid" | "invalid";
   errors: string | null;
+  warnings: string | null;
 }
 
 export const saveCoreConfig = (
diff --git a/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts b/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts
index 9d1545b1a41e..74f121b15b90 100644
--- a/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts
+++ b/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts
@@ -1,11 +1,18 @@
 import "@material/mwc-button";
-import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
+import {
+  css,
+  CSSResultGroup,
+  html,
+  LitElement,
+  nothing,
+  TemplateResult,
+} from "lit";
 import { customElement, property, state } from "lit/decorators";
 import { componentsWithService } from "../../../common/config/components_with_service";
 import "../../../components/buttons/ha-call-service-button";
 import "../../../components/ha-card";
 import "../../../components/ha-circular-progress";
-import { checkCoreConfig } from "../../../data/core";
+import { CheckConfigResult, checkCoreConfig } from "../../../data/core";
 import { domainToName } from "../../../data/integration";
 import { showRestartDialog } from "../../../dialogs/restart/show-dialog-restart";
 import { haStyle } from "../../../resources/styles";
@@ -32,14 +39,11 @@ export class DeveloperYamlConfig extends LitElement {
 
   @state() private _reloadableDomains: ReloadableDomain[] = [];
 
-  @state() private _isValid: boolean | null = null;
-
-  private _validateLog = "";
+  @state() private _validateResult?: CheckConfigResult;
 
   public disconnectedCallback() {
     super.disconnectedCallback();
-    this._isValid = null;
-    this._validateLog = "";
+    this._validateResult = undefined;
   }
 
   protected updated(changedProperties) {
@@ -68,34 +72,57 @@ export class DeveloperYamlConfig extends LitElement {
             ${this.hass.localize(
               "ui.panel.developer-tools.tabs.yaml.section.validation.introduction"
             )}
-            ${!this._validateLog
-              ? html`
-                  <div class="validate-container layout vertical center-center">
-                    ${!this._validating
-                      ? html`
-                          ${this._isValid
-                            ? html`<div class="validate-result" id="result">
-                                ${this.hass.localize(
-                                  "ui.panel.developer-tools.tabs.yaml.section.validation.valid"
-                                )}
-                              </div>`
-                            : ""}
-                        `
-                      : html`
-                          <ha-circular-progress active></ha-circular-progress>
-                        `}
-                  </div>
-                `
+            ${!this._validateResult
+              ? this._validating
+                ? html`<div
+                    class="validate-container layout vertical center-center"
+                  >
+                    <ha-circular-progress active></ha-circular-progress>
+                  </div> `
+                : nothing
               : html`
-                  <div class="config-invalid">
-                    <span class="text">
-                      ${this.hass.localize(
-                        "ui.panel.developer-tools.tabs.yaml.section.validation.invalid"
-                      )}
-                    </span>
-                  </div>
-                  <div id="configLog" class="validate-log">
-                    ${this._validateLog}
+                    <div class="validate-result ${
+                      this._validateResult.result === "invalid" ? "invalid" : ""
+                    }">
+                        ${
+                          this._validateResult.result === "valid"
+                            ? this.hass.localize(
+                                "ui.panel.developer-tools.tabs.yaml.section.validation.valid"
+                              )
+                            : this.hass.localize(
+                                "ui.panel.developer-tools.tabs.yaml.section.validation.invalid"
+                              )
+                        }
+                    </div>
+                  
+                    ${
+                      this._validateResult.errors
+                        ? html`<ha-alert
+                            alert-type="error"
+                            .title=${this.hass.localize(
+                              "ui.panel.developer-tools.tabs.yaml.section.validation.errors"
+                            )}
+                          >
+                            <span class="validate-log"
+                              >${this._validateResult.errors}</span
+                            >
+                          </ha-alert>`
+                        : ""
+                    }
+                    ${
+                      this._validateResult.warnings
+                        ? html`<ha-alert
+                            alert-type="warning"
+                            .title=${this.hass.localize(
+                              "ui.panel.developer-tools.tabs.yaml.section.validation.warnings"
+                            )}
+                          >
+                            <span class="validate-log"
+                              >${this._validateResult.warnings}</span
+                            >
+                          </ha-alert>`
+                        : ""
+                    }
                   </div>
                 `}
           </div>
@@ -108,7 +135,7 @@ export class DeveloperYamlConfig extends LitElement {
             <mwc-button
               class="warning"
               @click=${this._restart}
-              .disabled=${!!this._validateLog}
+              .disabled=${this._validateResult?.result === "invalid"}
             >
               ${this.hass.localize(
                 "ui.panel.developer-tools.tabs.yaml.section.server_management.restart"
@@ -173,22 +200,17 @@ export class DeveloperYamlConfig extends LitElement {
 
   private async _validateConfig() {
     this._validating = true;
-    this._validateLog = "";
-    this._isValid = null;
+    this._validateResult = undefined;
 
-    const configCheck = await checkCoreConfig(this.hass);
+    this._validateResult = await checkCoreConfig(this.hass);
     this._validating = false;
-    if (!this.isConnected) {
-      return;
-    }
-    this._isValid = configCheck.result === "valid";
-
-    if (configCheck.errors) {
-      this._validateLog = configCheck.errors;
-    }
   }
 
-  private _restart() {
+  private async _restart() {
+    await this._validateConfig();
+    if (this._validateResult?.result === "invalid") {
+      return;
+    }
     showRestartDialog(this);
   }
 
@@ -203,20 +225,16 @@ export class DeveloperYamlConfig extends LitElement {
         .validate-result {
           color: var(--success-color);
           font-weight: 500;
-        }
-
-        .config-invalid {
           margin: 1em 0;
           text-align: center;
         }
 
-        .config-invalid .text {
+        .validate-result.invalid {
           color: var(--error-color);
-          font-weight: 500;
         }
 
         .validate-log {
-          white-space: pre-line;
+          white-space: pre;
           direction: ltr;
         }
 
diff --git a/src/translations/en.json b/src/translations/en.json
index 20e3ad35d3e3..953ab5e368eb 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -5844,7 +5844,9 @@
                 "introduction": "A basic validation of the configuration is automatically done before restarting. The basic validation ensures the YAML configuration doesn't have errors which will prevent Home Assistant or any integration from starting. It's also possible to only do the basic validation check without restarting.",
                 "check_config": "Check configuration",
                 "valid": "Configuration will not prevent Home Assistant from starting!",
-                "invalid": "Configuration invalid!"
+                "invalid": "Configuration invalid!",
+                "warnings": "Configuration warnings",
+                "errors": "Configuration errors"
               },
               "reloading": {
                 "all": "All YAML configuration",