diff --git a/core/core-frontend/src/custom-component/component-list.ts b/core/core-frontend/src/custom-component/component-list.ts
index 0bee15dd6e..23af4224fd 100644
--- a/core/core-frontend/src/custom-component/component-list.ts
+++ b/core/core-frontend/src/custom-component/component-list.ts
@@ -509,6 +509,7 @@ const list = [
       borderWidth: 1,
       borderStyle: 'solid',
       borderColor: '#cccccc',
+      borderActive: true,
       backgroundColor: 'rgba(236,231,231,0.1)',
       backdropFilter: 'blur(0px)'
     }
@@ -524,6 +525,7 @@ const list = [
       height: 200,
       borderWidth: 1,
       borderColor: '#cccccc',
+      borderActive: true,
       backgroundColor: 'rgba(236,231,231,0.1)',
       backdropFilter: 'blur(0px)'
     }
diff --git a/core/core-frontend/src/custom-component/svgs/svg-triangle/Component.vue b/core/core-frontend/src/custom-component/svgs/svg-triangle/Component.vue
index 197e8b763c..7f12d9e1bf 100644
--- a/core/core-frontend/src/custom-component/svgs/svg-triangle/Component.vue
+++ b/core/core-frontend/src/custom-component/svgs/svg-triangle/Component.vue
@@ -6,14 +6,14 @@
         :points="points"
         :stroke="element.style.borderColor"
         :fill="element.style.backgroundColor"
-        :stroke-width="element.style.borderWidth"
+        :stroke-width="borderWidth"
       />
     </svg>
   </div>
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref, toRefs, watch } from 'vue'
+import { computed, onMounted, ref, toRefs, watch } from 'vue'
 
 const props = defineProps({
   propValue: {
@@ -51,6 +51,10 @@ onMounted(() => {
   draw()
 })
 
+const borderWidth = computed(() => {
+  return element.value.style.borderActive ? element.value.style.borderWidth : 0
+})
+
 const draw = () => {
   const { width, height } = element.value.style
   drawPolygon(width, height)