diff --git a/src/plugins/dashboard/public/application/_dashboard_app.scss b/src/plugins/dashboard/public/application/_dashboard_app.scss
index 56dfc1ad6146e..63a73d6f80c8f 100644
--- a/src/plugins/dashboard/public/application/_dashboard_app.scss
+++ b/src/plugins/dashboard/public/application/_dashboard_app.scss
@@ -34,10 +34,18 @@
   text-align: center;
 }
 
-.dshUnsavedListingItemTitle {
+.dshUnsavedListingItem {
+  margin-top: $euiSizeM;
+}
+
+.dshUnsavedListingItem__icon {
+  margin-right: $euiSizeM;
+}
+
+.dshUnsavedListingItem__title {
   margin-bottom: 0 !important;
 }
 
-.dshUnsavedListingButtons {
-  margin-left: 15px;
+.dshUnsavedListingItem__actions {
+  margin-left: $euiSizeL + $euiSizeXS;
 }
diff --git a/src/plugins/dashboard/public/application/listing/dashboard_unsaved_listing.tsx b/src/plugins/dashboard/public/application/listing/dashboard_unsaved_listing.tsx
index 1764894ddde92..a52af34b48133 100644
--- a/src/plugins/dashboard/public/application/listing/dashboard_unsaved_listing.tsx
+++ b/src/plugins/dashboard/public/application/listing/dashboard_unsaved_listing.tsx
@@ -45,17 +45,28 @@ const DashboardUnsavedItem = ({
   onDiscardClick: () => void;
 }) => {
   return (
-    <>
-      <EuiTitle size="xxs" className="dshUnsavedListingItemTitle">
-        <h3 className="dshUnsavedListingItemTitle">
-          <EuiIcon type="pencil" /> {dashboard?.title ?? getNewDashboardTitle()}
-        </h3>
-      </EuiTitle>
-      <EuiFlexGroup gutterSize="s" alignItems="flexStart" className="dshUnsavedListingButtons">
+    <div className="dshUnsavedListingItem">
+      <EuiFlexGroup alignItems="center" gutterSize="none">
+        <EuiFlexItem grow={false}>
+          <EuiIcon color="text" className="dshUnsavedListingItem__icon" type="dashboardApp" />
+        </EuiFlexItem>
+        <EuiFlexItem grow={false}>
+          <EuiTitle size="xxs">
+            <h4 className="dshUnsavedListingItem__title">
+              {dashboard?.title ?? getNewDashboardTitle()}
+            </h4>
+          </EuiTitle>
+        </EuiFlexItem>
+      </EuiFlexGroup>
+      <EuiFlexGroup
+        gutterSize="none"
+        alignItems="flexStart"
+        className="dshUnsavedListingItem__actions"
+      >
         <EuiFlexItem grow={false}>
           <EuiButtonEmpty
             flush="left"
-            size="xs"
+            size="s"
             color="primary"
             onClick={onOpenClick}
             data-test-subj={`edit-unsaved-${dashboard?.id ?? DASHBOARD_PANELS_UNSAVED_ID}`}
@@ -65,7 +76,7 @@ const DashboardUnsavedItem = ({
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiButtonEmpty
-            size="xs"
+            size="s"
             color="danger"
             onClick={onDiscardClick}
             data-test-subj={`discard-unsaved-${dashboard?.id ?? DASHBOARD_PANELS_UNSAVED_ID}`}
@@ -74,7 +85,7 @@ const DashboardUnsavedItem = ({
           </EuiButtonEmpty>
         </EuiFlexItem>
       </EuiFlexGroup>
-    </>
+    </div>
   );
 };
 
@@ -146,7 +157,10 @@ export const DashboardUnsavedListing = ({ redirectTo }: { redirectTo: DashboardR
 
   return items.length === 0 ? null : (
     <>
-      <EuiCallOut title={dashboardUnsavedListingStrings.getUnsavedChangesTitle(items.length > 1)}>
+      <EuiCallOut
+        heading="h3"
+        title={dashboardUnsavedListingStrings.getUnsavedChangesTitle(items.length > 1)}
+      >
         {items}
       </EuiCallOut>
       <EuiSpacer size="m" />
diff --git a/src/plugins/dashboard/public/dashboard_strings.ts b/src/plugins/dashboard/public/dashboard_strings.ts
index ba409d064dd82..b80d8df03743f 100644
--- a/src/plugins/dashboard/public/dashboard_strings.ts
+++ b/src/plugins/dashboard/public/dashboard_strings.ts
@@ -358,7 +358,7 @@ export const dashboardListingTable = {
 export const dashboardUnsavedListingStrings = {
   getUnsavedChangesTitle: (plural = false) =>
     i18n.translate('dashboard.listing.unsaved.unsavedChangesTitle', {
-      defaultMessage: 'You have unsaved changes in the following {dash}',
+      defaultMessage: 'You have unsaved changes in the following {dash}.',
       values: {
         dash: plural
           ? dashboardListingTable.getEntityNamePlural()