diff --git a/assets/style.css b/assets/style.css
index 36aa5d1..a540a96 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -203,4 +203,41 @@ th {
   
   .suggestion-item.tt-cursor {
     background-color: #f5f5f5;
-  }
\ No newline at end of file
+  }
+
+  /* Common styles for delete buttons */
+    .delete-button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 24px;
+        height: 24px;
+        border-radius: 50%;
+        border: none;
+        background-color: #ff4d4f;
+        color: white;
+        font-size: 16px;
+        font-weight: bold;
+        cursor: pointer;
+        margin-left: 8px;
+        transition: all 0.2s ease;
+        padding: 0;
+        line-height: 1;
+    }
+    .delete-button:hover {
+        background-color: #ff7875;
+        transform: scale(1.1);
+    }
+    .delete-button:active {
+        background-color: #d9363e;
+        transform: scale(0.95);
+    }
+    /* Specific styles for item delete buttons */
+    .item-delete {
+        vertical-align: middle;
+    }
+    /* Specific styles for property delete buttons */
+    .property-delete {
+        vertical-align: middle;
+        font-size: 14px;
+    }
\ No newline at end of file
diff --git a/src/components/items_list.rs b/src/components/items_list.rs
index 140ace6..1d0ce3d 100644
--- a/src/components/items_list.rs
+++ b/src/components/items_list.rs
@@ -854,7 +854,11 @@ pub fn ItemsList(
                             view! {
                                 <th>
                                     {item.name.clone()}
-                                    <button on:click=move |_| remove_item(index)>{ "Delete" }</button>
+                                    <button 
+                                        class="delete-button item-delete" 
+                                        on:click=move |_| remove_item(index)
+                                        title="Delete item"
+                                    >{ "×" }</button>
                                 </th>
                             }
                         }).collect::<Vec<_>>()} 
@@ -1176,21 +1180,25 @@ pub fn ItemsList(
                                 <tr>
                                     <td>
                                         { property_label }
-                                        <button class="delete-property" on:click=move |_| {
-                                            log!("Deleting property: {}", property_clone_for_button);
-                                            remove_property_clone(property_clone_for_button.clone());
-                                            set_custom_properties.update(|props| {
-                                                props.retain(|p| p != &property_clone_for_button);
-                                            });
-                                            set_selected_properties.update(|selected| {
-                                                selected.remove(&property_clone_for_button);
-                                            });
-                                            set_items.update(|items| {
-                                                for item in items {
-                                                    item.custom_properties.remove(&property_clone_for_button);
-                                                }
-                                            });
-                                        }>{ "Delete" }</button>
+                                        <button 
+                                            class="delete-button property-delete" 
+                                            title="Delete property"
+                                            on:click=move |_| {
+                                                log!("Deleting property: {}", property_clone_for_button);
+                                                remove_property_clone(property_clone_for_button.clone());
+                                                set_custom_properties.update(|props| {
+                                                    props.retain(|p| p != &property_clone_for_button);
+                                                });
+                                                set_selected_properties.update(|selected| {
+                                                    selected.remove(&property_clone_for_button);
+                                                });
+                                                set_items.update(|items| {
+                                                    for item in items {
+                                                        item.custom_properties.remove(&property_clone_for_button);
+                                                    }
+                                                });
+                                            }
+                                        >{ "x" }</button>
                                     </td>
                                     {move || {
                                         let update_item_cell = Arc::clone(&update_item_inner);