diff --git a/examples/sites/demos/pc/app/popconfirm/custom-class-composition-api.vue b/examples/sites/demos/pc/app/popconfirm/custom-class-composition-api.vue
index b2a0f2067e..eaa7d42f7b 100644
--- a/examples/sites/demos/pc/app/popconfirm/custom-class-composition-api.vue
+++ b/examples/sites/demos/pc/app/popconfirm/custom-class-composition-api.vue
@@ -21,7 +21,7 @@ const message = ref('这是气泡确认框提示内容文本描述，这是两
   background-color: #ccc;
 }
 
-.tiny-popover.tiny-popper.custom-class .popper__arrow::after {
-  border-top-color: #ccc;
+.tiny-popover.tiny-popper.custom-class .popper__arrow {
+  background-color: #ccc;
 }
 </style>
diff --git a/examples/sites/demos/pc/app/popconfirm/custom-class.vue b/examples/sites/demos/pc/app/popconfirm/custom-class.vue
index 54a96d912d..b0ca418f0d 100644
--- a/examples/sites/demos/pc/app/popconfirm/custom-class.vue
+++ b/examples/sites/demos/pc/app/popconfirm/custom-class.vue
@@ -30,7 +30,7 @@ export default {
   background-color: #ccc;
 }
 
-.tiny-popover.tiny-popper.custom-class .popper__arrow::after {
-  border-top-color: #ccc;
+.tiny-popover.tiny-popper.custom-class .popper__arrow {
+  background-color: #ccc;
 }
 </style>
diff --git a/examples/sites/demos/pc/app/popconfirm/type-composition-api.vue b/examples/sites/demos/pc/app/popconfirm/type-composition-api.vue
index 1a3d75bf6c..2ee63cafdc 100644
--- a/examples/sites/demos/pc/app/popconfirm/type-composition-api.vue
+++ b/examples/sites/demos/pc/app/popconfirm/type-composition-api.vue
@@ -24,7 +24,7 @@
       </template>
     </tiny-popconfirm>
 
-    <tiny-popconfirm :title="title" :type="TinyIconDel" :message="message">
+    <tiny-popconfirm :title="title" :type="TinyIconDel" :message="message" custom-class="custom-icon">
       <template #reference>
         <tiny-button>自定义</tiny-button>
       </template>
@@ -51,3 +51,9 @@ const TinyIconDel = iconDel()
   margin-bottom: 10px;
 }
 </style>
+
+<style>
+.custom-icon svg {
+  fill: var(--tv-color-icon-active);
+}
+</style>
diff --git a/examples/sites/demos/pc/app/popconfirm/type.vue b/examples/sites/demos/pc/app/popconfirm/type.vue
index 39fd3d91c2..557f9192b5 100644
--- a/examples/sites/demos/pc/app/popconfirm/type.vue
+++ b/examples/sites/demos/pc/app/popconfirm/type.vue
@@ -24,7 +24,7 @@
       </template>
     </tiny-popconfirm>
 
-    <tiny-popconfirm :title="title" :type="TinyIconDel" :message="message">
+    <tiny-popconfirm :title="title" :type="TinyIconDel" :message="message" custom-class="custom-icon">
       <template #reference>
         <tiny-button>自定义</tiny-button>
       </template>
@@ -60,3 +60,9 @@ export default {
   margin-bottom: 10px;
 }
 </style>
+
+<style>
+.custom-icon svg {
+  fill: var(--tv-color-icon-active);
+}
+</style>