diff --git a/nezha-fronted/src/assets/css/common.scss b/nezha-fronted/src/assets/css/common.scss
index e1b6dd32c..8dac53ec2 100644
--- a/nezha-fronted/src/assets/css/common.scss
+++ b/nezha-fronted/src/assets/css/common.scss
@@ -437,6 +437,14 @@ input, textarea {
 .is-disabled{
     color: $--color-text-disabled !important;
 }
-.ql-tooltip {
+.ql-snow .ql-tooltip {
    background: $--background-color-empty;
+  border: 1px solid $--select-page-focus-color;
+  box-shadow: 0px 0px 5px $--scrollbar-background-color;
+  color: $--color-text-primary;
+  input[type=text]{
+    border: 1px solid $--select-page-focus-color;
+    background: $--background-color-empty;
+    outline: none;
+  }
 }
diff --git a/nezha-fronted/src/assets/css/components/common/project/L5/CanvasProps.scss b/nezha-fronted/src/assets/css/components/common/project/L5/CanvasProps.scss
index d8833a65d..fa9a5445b 100644
--- a/nezha-fronted/src/assets/css/components/common/project/L5/CanvasProps.scss
+++ b/nezha-fronted/src/assets/css/components/common/project/L5/CanvasProps.scss
@@ -37,7 +37,7 @@
 }
 
 .project-title {
-  background: #eeeeee;
+  background: $--background-color-base;
   height: 36px;
   line-height: 36px;
   border-radius: 0;
diff --git a/nezha-fronted/src/assets/css/components/common/project/topology.scss b/nezha-fronted/src/assets/css/components/common/project/topology.scss
index b3197b5c0..757201ff9 100644
--- a/nezha-fronted/src/assets/css/components/common/project/topology.scss
+++ b/nezha-fronted/src/assets/css/components/common/project/topology.scss
@@ -60,7 +60,7 @@
     }
   }
   .edit-topologyLine{
-    background: rgba(196,196,196,0.4) !important;
+    //background: rgba(196,196,196,0.4) !important;
     border-bottom: 1px solid $--explore-border-color-bottom;
   }
   .topology-scroll{
@@ -333,10 +333,9 @@
     margin-right: 10px;
   }
   .project-title {
-    height: 55px;
+    height: 36px;
     padding-bottom: 0;
   }
-
   .drag-header {
     cursor: move;
     background: #1a1a1a;
@@ -543,3 +542,12 @@
   overflow: hidden;
   box-sizing: border-box;
 }
+.full.pr10 {
+  .el-select.el-select--small,.el-input {
+    background-color: $--background-color-empty;
+    border: 1px solid $--background-color-empty;
+  }
+}
+.el-upload-dragger{
+  background-color: $--background-color-empty;
+}
diff --git a/nezha-fronted/src/assets/css/themes/src/table.scss b/nezha-fronted/src/assets/css/themes/src/table.scss
index 319c5d135..d64dac5f0 100644
--- a/nezha-fronted/src/assets/css/themes/src/table.scss
+++ b/nezha-fronted/src/assets/css/themes/src/table.scss
@@ -259,6 +259,7 @@
       right: 0;
       width: 1px;
       height: 100%;
+      background: $--border-color-light;
     }
   }
 
diff --git a/nezha-fronted/src/components/common/ChartDiagram/diagram.vue b/nezha-fronted/src/components/common/ChartDiagram/diagram.vue
index f7e408179..480b2fa31 100644
--- a/nezha-fronted/src/components/common/ChartDiagram/diagram.vue
+++ b/nezha-fronted/src/components/common/ChartDiagram/diagram.vue
@@ -61,7 +61,7 @@
                <div slot="prefix">
                 <div class="icon-item" style="width: 100%;padding: 0">
                   <svg>
-                    <g fill="none" stroke="black" stroke-width="1">
+                    <g fill="none" :stroke="theme === 'light' ? 'black' : '#BEBEBE'" stroke-width="1">
                       <path
                         :d="penLineType.find((item,i)=>item.id==lineName).d"
                       >
@@ -74,7 +74,7 @@
                 <el-option v-for="(item,index) in penLineType" :value="item.id" :key="index">
                   <div class="icon-item" style="position: relative;width: 100%;padding: 0">
                     <svg>
-                    <g fill="none" :stroke="(lineName==item.name)?'#ee9d3f':'black'" stroke-width="1">
+                    <g fill="none" :stroke="(lineName==item.name)?'#ee9d3f': item.strokeColor " stroke-width="1">
                     <path :d="item.d" :stroke-dasharray="item['stroke-dasharray']"></path>
                     </g>
                     </svg>
@@ -354,7 +354,9 @@ const canvasOptions = {
 export default {
   name: 'diagram',
   data () {
+    const theme = localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`) || 'light'
     return {
+      theme,
       title: this.$t('overall.uploadCustomPicture'),
       objChange: false, // project 变化 用于判断 init是否执行完成 执行完成 才可以执行下次变化
       chartDataInfo: {},
@@ -517,10 +519,10 @@ export default {
       chartData: {},
       chartGetData: [],
       penLineType: [
-        { d: 'M5 19 a50,100 0 0,1 40,0', 'stroke-dasharray': '', name: this.$t('project.topology.curve'), id: 'curve' },
-        { d: 'M5 8 l20 0 l0 12 l20 0', 'stroke-dasharray': '', name: this.$t('project.topology.polyline'), id: 'polyline' },
-        { d: 'M5 14 l40 0', 'stroke-dasharray': '', name: this.$t('project.topology.line'), id: 'line' }
-        // {d:'M5 20 C0,8 50,0 85,0',"stroke-dasharray":"",name:'mind'},
+        { d: 'M5 19 a50,100 0 0,1 40,0', 'stroke-dasharray': '', name: this.$t('project.topology.curve'), id: 'curve' , strokeColor: theme == 'light' ? 'black' : '#BEBEBE'},
+        { d: 'M5 8 l20 0 l0 12 l20 0', 'stroke-dasharray': '', name: this.$t('project.topology.polyline'), id: 'polyline' , strokeColor: theme == 'light' ? 'black' : '#BEBEBE'},
+        { d: 'M5 14 l40 0', 'stroke-dasharray': '', name: this.$t('project.topology.line'), id: 'line' , strokeColor: theme == 'light' ? 'black' : '#BEBEBE'}
+        // {d:'M5 20 C0,8 50,0 85,0',"stroke-dasharray":"",name:'mind', strokeColor: theme == 'light' ? 'black' : '#BEBEBE'},
       ],
       lineName: 'curve',
       cachesIndex: 0,
@@ -831,8 +833,10 @@ export default {
           this.projectAlertShow = true
           this.saveData = { ...data }
           this.topologyInfo.name = ''
+          data.ruleColor = this.theme == 'light' ? '#4e4e4e' : '#BEBEBE'
           resolve(data)
         } else {
+          data.ruleColor = this.theme == 'light' ? '#4e4e4e' : '#BEBEBE'
           if (data.data) {
             this.topologyInfo = {
               fontSize: data.data.fontSize,
diff --git a/nezha-fronted/src/components/common/project/topologyL5.vue b/nezha-fronted/src/components/common/project/topologyL5.vue
index 3dbf52dda..3113461e2 100644
--- a/nezha-fronted/src/components/common/project/topologyL5.vue
+++ b/nezha-fronted/src/components/common/project/topologyL5.vue
@@ -828,9 +828,11 @@ export default {
             this.projectAlertShow = true
             this.saveData = JSON.parse(JSON.stringify(data))
             this.topologyInfo.name = this.obj.name
+            data.ruleColor = this.theme == 'light' ? '#4e4e4e' : '#BEBEBE'
             resolve(data)
             data = null
           } else {
+            data.ruleColor = this.theme == 'light' ? '#4e4e4e' : '#BEBEBE'
             if (data.data) {
               this.topologyInfo = {
                 fontSize: data.data.fontSize,
diff --git a/nezha-fronted/src/components/page/dashboard/explore/logTab.vue b/nezha-fronted/src/components/page/dashboard/explore/logTab.vue
index 7bfbb1752..f1668a6be 100644
--- a/nezha-fronted/src/components/page/dashboard/explore/logTab.vue
+++ b/nezha-fronted/src/components/page/dashboard/explore/logTab.vue
@@ -125,7 +125,9 @@ export default {
     }
   },
   data () {
+    const theme = localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`) || 'light'
     return {
+      theme,
       operations: {
         levels: [0, 1, 2, 3, 4, 5, 6],
         descending: true
@@ -262,8 +264,10 @@ export default {
             itemHeight: 4,
             borderRadius: 3,
             textStyle: {
-              padding: [0, 0, 0, 6]
-            }
+              padding: [0, 0, 0, 6],
+              color: this.theme == 'light' ? '#666666' : '#BEBEBE',
+            },
+            inactiveColor: this.theme == 'light' ? '#BEBEBE' : '#666666' // 字体颜色
           },
           series,
           xAxis: {