diff --git a/src/data/shopping-list.ts b/src/data/shopping-list.ts
index 1d1d16b26e..7a1d60a1ca 100644
--- a/src/data/shopping-list.ts
+++ b/src/data/shopping-list.ts
@@ -39,6 +39,15 @@ export const addItem = (
     name,
   });
 
+export const removeItem = (
+  hass: HomeAssistant,
+  item_id: string
+): Promise<ShoppingListItem> =>
+  hass.callWS({
+    type: "shopping_list/items/remove",
+    item_id,
+  });
+
 export const reorderItems = (
   hass: HomeAssistant,
   itemIds: string[]
diff --git a/src/panels/lovelace/cards/hui-shopping-list-card.ts b/src/panels/lovelace/cards/hui-shopping-list-card.ts
index 8886fdddbd..f1d82f45e3 100644
--- a/src/panels/lovelace/cards/hui-shopping-list-card.ts
+++ b/src/panels/lovelace/cards/hui-shopping-list-card.ts
@@ -8,32 +8,33 @@ import {
   PropertyValues,
   TemplateResult,
 } from "lit";
-import { customElement, property, state, query } from "lit/decorators";
+import { customElement, property, query, state } from "lit/decorators";
 import { classMap } from "lit/directives/class-map";
 import { guard } from "lit/directives/guard";
 import { repeat } from "lit/directives/repeat";
 import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element";
 import "../../../components/ha-card";
-import "../../../components/ha-svg-icon";
 import "../../../components/ha-checkbox";
+import "../../../components/ha-svg-icon";
 import "../../../components/ha-textfield";
+import type { HaTextField } from "../../../components/ha-textfield";
 import {
   addItem,
   clearItems,
   fetchItems,
+  removeItem,
   reorderItems,
   ShoppingListItem,
   updateItem,
 } from "../../../data/shopping-list";
 import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
-import { HomeAssistant } from "../../../types";
-import { LovelaceCard, LovelaceCardEditor } from "../types";
-import { SensorCardConfig, ShoppingListCardConfig } from "./types";
-import type { HaTextField } from "../../../components/ha-textfield";
 import {
   loadSortable,
   SortableInstance,
 } from "../../../resources/sortable.ondemand";
+import { HomeAssistant } from "../../../types";
+import { LovelaceCard, LovelaceCardEditor } from "../types";
+import { SensorCardConfig, ShoppingListCardConfig } from "./types";
 
 @customElement("hui-shopping-list-card")
 class HuiShoppingListCard
@@ -264,9 +265,14 @@ class HuiShoppingListCard
   }
 
   private _saveEdit(ev): void {
-    updateItem(this.hass!, ev.target.itemId, {
-      name: ev.target.value,
-    }).catch(() => this._fetchData());
+    // If name is not empty, update the item otherwise remove it
+    if (ev.target.value) {
+      updateItem(this.hass!, ev.target.itemId, {
+        name: ev.target.value,
+      }).catch(() => this._fetchData());
+    } else {
+      removeItem(this.hass!, ev.target.itemId).catch(() => this._fetchData());
+    }
 
     ev.target.blur();
   }