diff --git a/src/panels/lovelace/badges/hui-badge.ts b/src/panels/lovelace/badges/hui-badge.ts
index 4ba4e2cd6d8c..9b362fd173a5 100644
--- a/src/panels/lovelace/badges/hui-badge.ts
+++ b/src/panels/lovelace/badges/hui-badge.ts
@@ -21,7 +21,7 @@ declare global {
 
 @customElement("hui-badge")
 export class HuiBadge extends ReactiveElement {
-  @property({ attribute: false }) public preview = false;
+  @property({ type: Boolean }) public preview = false;
 
   @property({ attribute: false }) public config?: LovelaceBadgeConfig;
 
diff --git a/src/panels/lovelace/views/hui-view.ts b/src/panels/lovelace/views/hui-view.ts
index a4391a753b0d..f236a8ef832e 100644
--- a/src/panels/lovelace/views/hui-view.ts
+++ b/src/panels/lovelace/views/hui-view.ts
@@ -216,6 +216,9 @@ export class HUIView extends ReactiveElement {
         this._cards.forEach((element) => {
           element.preview = this.lovelace.editMode;
         });
+        this._badges.forEach((element) => {
+          element.preview = this.lovelace.editMode;
+        });
       }
       if (changedProperties.has("_cards")) {
         this._layoutElement.cards = this._cards;