diff --git a/app/src/assets/scss/component/_button.scss b/app/src/assets/scss/component/_button.scss
index 31f2fc7e9..bd0a9c1f4 100644
--- a/app/src/assets/scss/component/_button.scss
+++ b/app/src/assets/scss/component/_button.scss
@@ -61,7 +61,7 @@
   &--big {
     min-width: 214px;
     background: var(--b3-theme-secondary);
-    color:var(--b3-theme-on-secondary);
+    color: var(--b3-theme-on-secondary);
     padding: 24px 16px;
     font-size: 16px;
   }
@@ -104,6 +104,23 @@
     }
   }
 
+  &--remove {
+    color: var(--b3-card-error-color);
+    box-shadow: inset 0 0 0 .6px var(--b3-card-error-color);
+    background-color: transparent;
+
+    &:hover,
+    &:focus {
+      background-color: var(--b3-card-error-background);
+      box-shadow: inset 0 0 0 1px var(--b3-card-error-color);
+    }
+
+    &:active {
+      background-color: var(--b3-card-error-background);
+      box-shadow: inset 0 0 0 1px var(--b3-card-error-color);
+    }
+  }
+
   &--white {
     padding: 4px 8px;
     font-size: 12px;
diff --git a/app/src/protyle/render/av/col.ts b/app/src/protyle/render/av/col.ts
index 6a94e3fd9..7e176cd20 100644
--- a/app/src/protyle/render/av/col.ts
+++ b/app/src/protyle/render/av/col.ts
@@ -859,17 +859,18 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
                             content: `<div class="b3-dialog__content">
     ${window.siyuan.languages.confirmRemoveRelationField.replace("${x}", relResponse.data.av.name)}
     <div class="fn__hr--b"></div>
-    <button class="fn__block b3-button b3-button--error">${window.siyuan.languages.delete}</button>
+    <button class="fn__block b3-button b3-button--remove" data-action="delete">${window.siyuan.languages.delete}</button>
     <div class="fn__hr"></div>
-    <button class="fn__block b3-button b3-button--warning">${window.siyuan.languages.removeButKeepRelationField}</button>
+    <button class="fn__block b3-button b3-button--remove" data-action="keep-relation">${window.siyuan.languages.removeButKeepRelationField}</button>
     <div class="fn__hr"></div>
-    <button class="fn__block b3-button b3-button--info">${window.siyuan.languages.cancel}</button>
+    <button class="fn__block b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button>
 </div>`,
                         });
                         dialog.element.addEventListener("click", (event) => {
                             let target = event.target as HTMLElement;
                             while (target && !target.isSameNode(dialog.element)) {
-                                if (target.classList.contains("b3-button--error")) {
+                                const action = target.getAttribute("data-action");
+                                if (action === "delete") {
                                     removeColByMenu({
                                         protyle,
                                         colId,
@@ -883,7 +884,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
                                     });
                                     dialog.destroy();
                                     break;
-                                } else if (target.classList.contains("b3-button--warning")) {
+                                } else if (action === "keep-relation") {
                                     removeColByMenu({
                                         protyle,
                                         colId,
@@ -897,7 +898,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
                                     });
                                     dialog.destroy();
                                     break;
-                                } else if (target.classList.contains("b3-button--info")) {
+                                } else if (target.classList.contains("b3-button--cancel")) {
                                     dialog.destroy();
                                     break;
                                 }
diff --git a/app/src/protyle/render/av/openMenuPanel.ts b/app/src/protyle/render/av/openMenuPanel.ts
index cc27b3e4d..2bb39916c 100644
--- a/app/src/protyle/render/av/openMenuPanel.ts
+++ b/app/src/protyle/render/av/openMenuPanel.ts
@@ -1099,17 +1099,18 @@ export const openMenuPanel = (options: {
                             content: `<div class="b3-dialog__content">
     ${isTwoWay ? window.siyuan.languages.confirmRemoveRelationField.replace("${x}", menuElement.querySelector('.b3-menu__item[data-type="goSearchAV"] .b3-menu__accelerator').textContent) : window.siyuan.languages.removeCol.replace("${x}", menuElement.querySelector("input").value)}
     <div class="fn__hr--b"></div>
-    <button class="fn__block b3-button b3-button--error">${window.siyuan.languages.delete}</button>
+    <button class="fn__block b3-button b3-button--remove" data-action="delete">${window.siyuan.languages.delete}</button>
     <div class="fn__hr"></div>
-    <button class="fn__block b3-button b3-button--warning${isTwoWay ? "" : " fn__none"}">${window.siyuan.languages.removeButKeepRelationField}</button>
+    <button class="fn__block b3-button b3-button--remove${isTwoWay ? "" : " fn__none"}" data-action="keep-relation">${window.siyuan.languages.removeButKeepRelationField}</button>
     <div class="fn__hr"></div>
-    <button class="fn__block b3-button b3-button--info">${window.siyuan.languages.cancel}</button>
+    <button class="fn__block b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button>
 </div>`,
                         });
                         dialog.element.addEventListener("click", (event) => {
                             let target = event.target as HTMLElement;
                             while (target && !target.isSameNode(dialog.element)) {
-                                if (target.classList.contains("b3-button--error")) {
+                                const action = target.getAttribute("data-action");
+                                if (action === "delete") {
                                     removeCol({
                                         protyle: options.protyle,
                                         data,
@@ -1124,7 +1125,7 @@ export const openMenuPanel = (options: {
                                     });
                                     dialog.destroy();
                                     break;
-                                } else if (target.classList.contains("b3-button--warning")) {
+                                } else if (action === "keep-relation") {
                                     removeCol({
                                         protyle: options.protyle,
                                         data,
@@ -1139,7 +1140,7 @@ export const openMenuPanel = (options: {
                                     });
                                     dialog.destroy();
                                     break;
-                                } else if (target.classList.contains("b3-button--info")) {
+                                } else if (target.classList.contains("b3-button--cancel")) {
                                     dialog.destroy();
                                     break;
                                 }