diff --git a/frontend/src/assets/img/add_component.png b/frontend/src/assets/img/add_component.png
new file mode 100644
index 00000000..d09055d2
Binary files /dev/null and b/frontend/src/assets/img/add_component.png differ
diff --git a/frontend/src/views/dashboard/canvas/CanvasCore.vue b/frontend/src/views/dashboard/canvas/CanvasCore.vue
index 9eb1c755..73a7610d 100644
--- a/frontend/src/views/dashboard/canvas/CanvasCore.vue
+++ b/frontend/src/views/dashboard/canvas/CanvasCore.vue
@@ -1206,7 +1206,7 @@ defineExpose({
     <EmptyBackground
       v-if="!canvasComponentData.length && isMainCanvas(canvasId)"
       :description="t('dashboard.add_component_tips')"
-      img-type="selectDashboard"
+      img-type="addComponent"
     />
     <template v-if="renderOk">
       <CanvasShape
diff --git a/frontend/src/views/dashboard/common/EmptyBackground.vue b/frontend/src/views/dashboard/common/EmptyBackground.vue
index 57559007..dffd42be 100644
--- a/frontend/src/views/dashboard/common/EmptyBackground.vue
+++ b/frontend/src/views/dashboard/common/EmptyBackground.vue
@@ -4,6 +4,7 @@ import nothingInput from '@/assets/img/nothing-input.png'
 import nothingSelect from '@/assets/img/nothing-select.png'
 import nothingTable from '@/assets/img/nothing-table.png'
 import nothingSelectDashboard from '@/assets/img/none-dashboard.png'
+import addComponent from '@/assets/img/add_component.png'
 import none from '@/assets/img/none.png'
 import error from '@/assets/img/error.png'
 import nothingTree from '@/assets/img/nothing-tree.png'
@@ -11,7 +12,15 @@ import nothingNone from '@/assets/img/nothing-none.png'
 defineProps({
   imgType: {
     type: String as PropType<
-      'input' | 'select' | 'table' | 'none' | 'noneWhite' | 'tree' | 'error' | 'selectDashboard'
+      | 'input'
+      | 'select'
+      | 'table'
+      | 'none'
+      | 'noneWhite'
+      | 'tree'
+      | 'error'
+      | 'selectDashboard'
+      | 'addComponent'
     >,
     default: 'table',
   },
@@ -33,6 +42,7 @@ const getAssetsFile = {
   selectDashboard: nothingSelectDashboard,
   error,
   none,
+  addComponent,
 }
 </script>
 
diff --git a/frontend/src/views/dashboard/editor/DashboardEditor.vue b/frontend/src/views/dashboard/editor/DashboardEditor.vue
index 2db905bd..1ae35312 100644
--- a/frontend/src/views/dashboard/editor/DashboardEditor.vue
+++ b/frontend/src/views/dashboard/editor/DashboardEditor.vue
@@ -140,6 +140,9 @@ const emits = defineEmits(['parentAddItemBox'])
   width: 100%;
   height: 100%;
   overflow-y: auto;
+  :deep(.ed-empty__description) {
+    width: 240px !important;
+  }
 }
 
 .move-in-active {