diff --git a/src/components/ha-chip-set.ts b/src/components/ha-chip-set.ts
index 353493941b..9f1e237188 100644
--- a/src/components/ha-chip-set.ts
+++ b/src/components/ha-chip-set.ts
@@ -51,6 +51,10 @@ export class HaChipSet extends LitElement {
   static get styles(): CSSResult {
     return css`
       ${unsafeCSS(chipStyles)}
+
+      ha-chip {
+        margin: 4px;
+      }
     `;
   }
 }
diff --git a/src/components/ha-chip.ts b/src/components/ha-chip.ts
index 50e04dee7a..2f57b6c943 100644
--- a/src/components/ha-chip.ts
+++ b/src/components/ha-chip.ts
@@ -24,7 +24,7 @@ declare global {
 export class HaChip extends LitElement {
   @property() public index = 0;
 
-  @property({type: Boolean}) public hasIcon = false;
+  @property({ type: Boolean }) public hasIcon = false;
 
   protected render(): TemplateResult {
     return html`
@@ -48,7 +48,6 @@ export class HaChip extends LitElement {
     return css`
       ${unsafeCSS(chipStyles)}
       .mdc-chip {
-        margin: 4px;
         background-color: var(
           --ha-chip-background-color,
           rgba(var(--rgb-primary-text-color), 0.15)