diff --git a/ruoyi-framework/src/main/java/com/ruoyi/framework/config/CaptchaConfig.java b/ruoyi-framework/src/main/java/com/ruoyi/framework/config/CaptchaConfig.java
index 43e78ae..7788e08 100644
--- a/ruoyi-framework/src/main/java/com/ruoyi/framework/config/CaptchaConfig.java
+++ b/ruoyi-framework/src/main/java/com/ruoyi/framework/config/CaptchaConfig.java
@@ -50,10 +50,13 @@ public class CaptchaConfig
         Properties properties = new Properties();
         // 是否有边框 默认为true 我们可以自己设置yes，no
         properties.setProperty(KAPTCHA_BORDER, "yes");
-        // 边框颜色 默认为Color.BLACK
-        properties.setProperty(KAPTCHA_BORDER_COLOR, "105,179,90");
-        // 验证码文本字符颜色 默认为Color.BLACK
-        properties.setProperty(KAPTCHA_TEXTPRODUCER_FONT_COLOR, "blue");
+        // 边框颜色 修改为科技蓝
+        properties.setProperty(KAPTCHA_BORDER_COLOR, "64,158,255");
+        // 验证码文本字符颜色 修改为白色适配深色背景
+        properties.setProperty(KAPTCHA_TEXTPRODUCER_FONT_COLOR, "255,255,255");
+        //背景颜色渐变 修改为统一的深蓝科技感背景
+        properties.setProperty(KAPTCHA_BACKGROUND_CLR_FROM, "28,132,198");
+        properties.setProperty(KAPTCHA_BACKGROUND_CLR_TO, "28,132,198");
         // 验证码图片宽度 默认为200
         properties.setProperty(KAPTCHA_IMAGE_WIDTH, "160");
         // 验证码图片高度 默认为50
@@ -70,8 +73,8 @@ public class CaptchaConfig
         properties.setProperty(KAPTCHA_TEXTPRODUCER_CHAR_LENGTH, "6");
         // 验证码文本字体样式 默认为new Font("Arial", 1, fontSize), new Font("Courier", 1, fontSize)
         properties.setProperty(KAPTCHA_TEXTPRODUCER_FONT_NAMES, "Arial,Courier");
-        // 验证码噪点颜色 默认为Color.BLACK
-        properties.setProperty(KAPTCHA_NOISE_COLOR, "white");
+        // 验证码噪点颜色 修改为科技蓝
+        properties.setProperty(KAPTCHA_NOISE_COLOR, "64,158,255");
         // 干扰实现类
         properties.setProperty(KAPTCHA_NOISE_IMPL, "com.google.code.kaptcha.impl.NoNoise");
         // 图片样式 水纹com.google.code.kaptcha.impl.WaterRipple 鱼眼com.google.code.kaptcha.impl.FishEyeGimpy 阴影com.google.code.kaptcha.impl.ShadowGimpy
@@ -80,4 +83,5 @@ public class CaptchaConfig
         defaultKaptcha.setConfig(config);
         return defaultKaptcha;
     }
+
 }
diff --git a/ruoyi-ui/src/assets/images/login-background.jpg b/ruoyi-ui/src/assets/images/login-background.jpg
index 8a89eb8..617626e 100644
Binary files a/ruoyi-ui/src/assets/images/login-background.jpg and b/ruoyi-ui/src/assets/images/login-background.jpg differ
diff --git a/ruoyi-ui/src/assets/styles/element-variables.scss b/ruoyi-ui/src/assets/styles/element-variables.scss
index 1615ff2..01c694d 100644
--- a/ruoyi-ui/src/assets/styles/element-variables.scss
+++ b/ruoyi-ui/src/assets/styles/element-variables.scss
@@ -4,24 +4,32 @@
 **/
 
 /* theme color */
-$--color-primary: #1890ff;
-$--color-success: #13ce66;
-$--color-warning: #ffba00;
-$--color-danger: #ff4949;
-// $--color-info: #1E1E1E;
+$--color-primary: #00d4ff;
+$--color-success: #00ff9d;
+$--color-warning: #ffaa00;
+$--color-danger: #ff4d4d;
+$--color-info: #6b7280;
 
 $--button-font-weight: 400;
 
-// $--color-text-regular: #1f2d3d;
+$--color-text-primary: #ffffff;
+$--color-text-regular: #e2e8f0;
+$--color-text-secondary: #cbd5e1;
+$--color-text-placeholder: #94a3b8;
 
-$--border-color-light: #dfe4ed;
-$--border-color-lighter: #e6ebf5;
+$--border-color-base: #334155;
+$--border-color-light: #475569;
+$--border-color-lighter: #64748b;
 
-$--table-border: 1px solid #dfe6ec;
+$--background-color-base: #1a1a2e;
+$--color-white: #1e1e2d;
+
+$--table-border: 1px solid #334155;
 
 /* icon font path, required */
 $--font-path: '~element-ui/lib/theme-chalk/fonts';
 
+
 @import "~element-ui/packages/theme-chalk/src/index";
 
 // the :export directive is the magic sauce for webpack
diff --git a/ruoyi-ui/src/assets/styles/index.scss b/ruoyi-ui/src/assets/styles/index.scss
index bb87292..c6f5389 100644
--- a/ruoyi-ui/src/assets/styles/index.scss
+++ b/ruoyi-ui/src/assets/styles/index.scss
@@ -11,19 +11,24 @@ body {
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
   font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+  background-color: #1a1a2e;
+  color: #ffffff;
 }
 
 label {
   font-weight: 700;
+  color: #ffffff;
 }
 
 html {
   height: 100%;
   box-sizing: border-box;
+  background-color: #1a1a2e;
 }
 
 #app {
   height: 100%;
+  background-color: #1a1a2e;
 }
 
 *,
@@ -49,7 +54,7 @@ a,
 a:focus,
 a:hover {
   cursor: pointer;
-  color: inherit;
+  color: #00d4ff;
   text-decoration: none;
 }
 
@@ -97,7 +102,7 @@ div:focus {
 }
 
 aside {
-  background: #eef1f6;
+  background: #1e1e2d;
   padding: 8px 24px;
   margin-bottom: 20px;
   border-radius: 2px;
@@ -105,16 +110,17 @@ aside {
   line-height: 32px;
   font-size: 16px;
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-  color: #2c3e50;
+  color: #e2e8f0;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  border: 1px solid rgba(255, 255, 255, 0.1);
 
   a {
-    color: #337ab7;
+    color: #00d4ff;
     cursor: pointer;
 
     &:hover {
-      color: rgb(32, 160, 255);
+      color: #33ddff;
     }
   }
 }
@@ -122,11 +128,16 @@ aside {
 //main-container全局样式
 .app-container {
   padding: 20px;
+  background-color: #1a1a2e;
 }
 
 .components-container {
   margin: 30px 50px;
   position: relative;
+  background-color: #1e1e2d;
+  border-radius: 4px;
+  padding: 20px;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.3);
 }
 
 .text-center {
@@ -141,38 +152,1061 @@ aside {
   text-align: right;
   padding-right: 20px;
   transition: 600ms ease position;
-  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
+  background: linear-gradient(90deg, rgba(0, 212, 255, 0.8) 0%, rgba(0, 212, 255, 0.6) 100%);
 
   .subtitle {
     font-size: 20px;
-    color: #fff;
+    color: #000;
   }
 
   &.draft {
-    background: #d0d0d0;
+    background: #1e1e2d;
+    border: 1px dashed #64748b;
   }
 
   &.deleted {
-    background: #d0d0d0;
+    background: #1e1e2d;
+    border: 1px dashed #64748b;
   }
 }
 
 .link-type,
 .link-type:focus {
-  color: #337ab7;
+  color: #00d4ff;
   cursor: pointer;
 
   &:hover {
-    color: rgb(32, 160, 255);
+    color: #33ddff;
   }
 }
 
 .filter-container {
   padding-bottom: 10px;
+  background-color: #1e1e2d;
+  padding: 15px;
+  border-radius: 4px;
+  margin-bottom: 15px;
+  border: 1px solid #334155;
 
   .filter-item {
     display: inline-block;
     vertical-align: middle;
     margin-bottom: 10px;
+    margin-right: 10px;
+  }
+}
+//上传组件颜色
+.el-upload--picture-card {
+  background-color: var(--tech-card-bg);
+  border-radius: 6px;
+
+  &:hover {
+    border-color: var(--tech-primary);
+    background-color: rgba(0, 120, 212, 0.05);
+  }
+}
+// 用户管理页面特定样式
+.user-container {
+  .filter-container {
+    background-color: #1e1e2d;
+    border: 1px solid #334155;
+    border-radius: 4px;
+    margin-bottom: 15px;
+
+    .filter-item {
+      margin-right: 10px;
+    }
+  }
+
+  // 搜索按钮样式
+  .el-button {
+    &.filter-item {
+      background-color: rgba(0, 212, 255, 0.1);
+      border-color: rgba(0, 212, 255, 0.3);
+      color: #00d4ff;
+
+      &:hover {
+        background-color: rgba(0, 212, 255, 0.2);
+        border-color: #00d4ff;
+      }
+    }
+  }
+}
+
+// 表格组件样式优化
+.el-table {
+  background-color: #1e1e2d;
+  color: #e2e8f0;
+  border: 1px solid #334155;
+
+  // 表头单元格样式
+  .el-table__header-wrapper {
+    th {
+      background-color: rgba(0, 212, 255, 0.15) !important;
+      color: #00d4ff !important;
+      font-weight: 600;
+      border-bottom: 1px solid #334155;
+
+      &.is-sortable {
+        &:hover {
+          background-color: rgba(0, 212, 255, 0.2) !important;
+        }
+      }
+
+      // 排序图标颜色
+      .caret-wrapper {
+        .sort-caret {
+          &.ascending,
+          &.descending {
+            color: #00d4ff;
+          }
+        }
+      }
+    }
+  }
+
+  // 多级表头样式
+  .el-table__header {
+    th {
+      background-color: rgba(0, 212, 255, 0.15);
+      color: #00d4ff;
+    }
+  }
+
+  // 表头样式
+  th {
+    background-color: rgba(0, 212, 255, 0.15);
+    color: #00d4ff;
+    font-weight: 600;
+    border-bottom: 1px solid #334155;
+
+    &.is-sortable {
+      &:hover {
+        background-color: rgba(0, 212, 255, 0.2);
+      }
+    }
+  }
+
+  // 表格数据行
+  td {
+    background-color: transparent;
+    color: #e2e8f0;
+    border-bottom: 1px solid #334155;
+  }
+
+  // 表格行悬停效果
+  .el-table__row:hover {
+    background-color: rgba(0, 212, 255, 0.05);
+  }
+
+  // 表格边框
+  &::before {
+    background-color: #334155;
+  }
+
+  // 展开行样式
+  .el-table__expanded-cell {
+    background-color: #1a1a2e;
+  }
+
+  // 固定列样式
+  .el-table__fixed,
+  .el-table__fixed-right {
+    background-color: #1e1e2d;
+
+    th {
+      background-color: rgba(0, 212, 255, 0.15);
+    }
+  }
+
+  // 表格空状态
+  .el-table__empty-block {
+    background-color: #1e1e2d;
+
+    .el-table__empty-text {
+      color: #94a3b8;
+    }
+  }
+}
+
+// 分页组件样式优化
+.el-pagination {
+  background-color: #1e1e2d;
+  color: #e2e8f0;
+  padding: 15px;
+  border-radius: 0 0 4px 4px;
+
+  // 页码按钮样式
+  .el-pager li {
+    background-color: transparent;
+    color: #cbd5e1;
+    border: 1px solid #334155;
+    margin: 0 2px;
+    min-width: 30px;
+    height: 30px;
+    line-height: 28px;
+
+    &:hover {
+      color: #00d4ff;
+      border-color: #00d4ff;
+    }
+
+    &.active {
+      background-color: #00d4ff;
+      color: #000;
+      border-color: #00d4ff;
+    }
+  }
+
+  // 上一页/下一页按钮
+  .btn-prev,
+  .btn-next {
+    background-color: transparent;
+    color: #cbd5e1;
+    border: 1px solid #334155;
+    min-width: 30px;
+    height: 30px;
+    line-height: 28px;
+
+    &:disabled {
+      color: #64748b;
+    }
+
+    &:not(.disabled):hover {
+      color: #00d4ff;
+      border-color: #00d4ff;
+    }
+  }
+
+  // 跳转输入框
+  .el-pagination__jump {
+    color: #e2e8f0;
+    margin-left: 15px;
+
+    .el-input__inner {
+      background-color: rgba(255, 255, 255, 0.08);
+      border: 1px solid #334155;
+      color: #e2e8f0;
+      width: 50px;
+      height: 30px;
+
+      &:focus {
+        border-color: #00d4ff;
+      }
+    }
+  }
+
+  // 每页条数选择器
+  .el-pagination__sizes {
+    .el-select {
+      .el-input__inner {
+        background-color: rgba(255, 255, 255, 0.08);
+        border: 1px solid #334155;
+        color: #e2e8f0;
+        height: 30px;
+        line-height: 30px;
+      }
+
+      &:hover {
+        .el-input__inner {
+          border-color: #00d4ff;
+        }
+      }
+    }
+  }
+
+  // 总条数显示
+  .el-pagination__total {
+    color: #e2e8f0;
+  }
+}
+
+// 用户操作按钮统一样式
+.el-button {
+  &--primary {
+    background-color: #00d4ff;
+    border-color: #00d4ff;
+    color: #000;
+
+    &:hover {
+      background-color: #33ddff;
+      border-color: #33ddff;
+    }
+  }
+
+  &--success {
+    background-color: #00ff9d;
+    border-color: #00ff9d;
+    color: #000;
+
+    &:hover {
+      background-color: #33ffaf;
+      border-color: #33ffaf;
+    }
+  }
+
+  &--warning {
+    background-color: #ffaa00;
+    border-color: #ffaa00;
+    color: #000;
+
+    &:hover {
+      background-color: #ffbb33;
+      border-color: #ffbb33;
+    }
+  }
+
+  &--danger {
+    background-color: #ff4d4d;
+    border-color: #ff4d4d;
+    color: #fff;
+
+    &:hover {
+      background-color: #ff6666;
+      border-color: #ff6666;
+    }
+  }
+
+  &--info {
+    background-color: #6b7280;
+    border-color: #6b7280;
+    color: #fff;
+
+    &:hover {
+      background-color: #7b8290;
+      border-color: #7b8290;
+    }
+  }
+
+  // 用户管理页面按钮样式
+  &.filter-item {
+    background-color: rgba(0, 212, 255, 0.1);
+    border-color: rgba(0, 212, 255, 0.3);
+    color: #00d4ff;
+
+    &:hover {
+      background-color: rgba(0, 212, 255, 0.2);
+      border-color: #00d4ff;
+    }
+  }
+}
+
+// 用户管理页面容器样式
+.user-manage-container {
+  background-color: #1a1a2e;
+  color: #ffffff;
+
+  // 页面标题
+  .page-header {
+    color: #00d4ff;
+    border-bottom: 1px solid #334155;
+    padding-bottom: 15px;
+    margin-bottom: 20px;
+  }
+}
+
+// 用户搜索区域
+.user-search-area {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  border-radius: 4px;
+  padding: 20px;
+  margin-bottom: 20px;
+
+  .search-title {
+    color: #00d4ff;
+    font-size: 16px;
+    margin-bottom: 15px;
+  }
+}
+
+// 搜索表单
+.user-search-form {
+  .el-form-item {
+    margin-bottom: 15px;
+
+    .el-form-item__label {
+      color: #e2e8f0;
+    }
+
+    .el-input__inner {
+      background-color: rgba(255, 255, 255, 0.08);
+      border: 1px solid #334155;
+      color: #e2e8f0;
+
+      &:focus {
+        border-color: #00d4ff;
+      }
+    }
+  }
+}
+
+// 用户操作按钮区域
+.user-action-bar {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  border-radius: 4px;
+  padding: 15px;
+  margin-bottom: 20px;
+
+  // 主要操作按钮
+  .el-button--primary {
+    background-color: #00d4ff;
+    border-color: #00d4ff;
+    color: #000;
+
+    &:hover {
+      background-color: #33ddff;
+      border-color: #33ddff;
+    }
+  }
+
+  // 批量操作按钮
+  .batch-action-btn {
+    background-color: rgba(0, 212, 255, 0.1);
+    border-color: rgba(0, 212, 255, 0.3);
+    color: #00d4ff;
+
+    &:hover {
+      background-color: rgba(0, 212, 255, 0.2);
+      border-color: #00d4ff;
+    }
+  }
+}
+
+// 用户管理页面右侧数据区域
+.user-data-container {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  border-radius: 4px;
+
+  // 数据展示区域
+  .data-display-area {
+    background-color: #1e1e2d;
+  }
+}
+
+// 右侧主要内容区域
+.main-content-area {
+  background-color: #1e1e2d;
+
+  // 内容卡片
+  .content-card {
+    background-color: #1e1e2d;
+    border: 1px solid #334155;
+  }
+}
+
+// 用户信息展示区域
+.user-info-section {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  border-radius: 4px;
+  padding: 20px;
+
+  .section-title {
+    color: #00d4ff;
+    border-bottom: 1px solid #334155;
+    padding-bottom: 10px;
+    margin-bottom: 15px;
+  }
+}
+
+// 数据统计区域
+.data-statistics {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  border-radius: 4px;
+  padding: 15px;
+
+  .statistic-item {
+    .statistic-label {
+      color: #cbd5e1;
+    }
+
+    .statistic-value {
+      color: #00d4ff;
+    }
+  }
+}
+
+// 部门树形结构样式
+.department-tree {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  border-radius: 4px;
+  padding: 15px;
+  margin-bottom: 20px;
+
+  .el-tree {
+    background-color: transparent;
+    color: #e2e8f0;
+
+    .el-tree-node__content {
+      &:hover {
+        background-color: rgba(0, 212, 255, 0.1);
+      }
+    }
+
+    .el-tree-node.is-current > .el-tree-node__content {
+      background-color: rgba(0, 212, 255, 0.15);
+      color: #00d4ff;
+    }
+  }
+
+  .el-tree--highlight-current {
+    .el-tree-node.is-current > .el-tree-node__content {
+      background-color: rgba(0, 212, 255, 0.15);
+    }
+  }
+}
+
+// 搜索栏容器
+.search-container {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  border-radius: 4px;
+  padding: 20px;
+  margin-bottom: 20px;
+
+  // 搜索标题
+  .search-title {
+    color: #00d4ff;
+    font-size: 16px;
+    margin-bottom: 15px;
+    font-weight: 500;
+  }
+
+  // 搜索条件区域
+  .search-conditions {
+    background-color: rgba(255, 255, 255, 0.03);
+    border-radius: 4px;
+    padding: 15px;
+    margin-bottom: 15px;
+  }
+}
+
+// 搜索表单元素
+.search-form {
+  .el-form-item {
+    margin-bottom: 18px;
+
+    .el-form-item__label {
+      color: #e2e8f0;
+      font-weight: normal;
+    }
+
+    .el-input__inner {
+      background-color: rgba(255, 255, 255, 0.08);
+      border: 1px solid #334155;
+      color: #e2e8f0;
+      border-radius: 4px;
+
+      &:focus {
+        border-color: #00d4ff;
+        box-shadow: 0 0 0 2px rgba(0, 212, 255, 0.2);
+      }
+
+      &::placeholder {
+        color: #94a3b8;
+      }
+    }
+
+    .el-select {
+      .el-input__inner {
+        background-color: rgba(255, 255, 255, 0.08);
+        border: 1px solid #334155;
+        color: #e2e8f0;
+      }
+
+      &:hover {
+        .el-input__inner {
+          border-color: #00d4ff;
+        }
+      }
+    }
+
+    .el-date-editor {
+      .el-input__inner {
+        background-color: rgba(255, 255, 255, 0.08);
+        border: 1px solid #334155;
+        color: #e2e8f0;
+      }
+    }
+  }
+}
+//日期
+input.el-range-input{
+  background-color: #2f4258 !important;
+}
+// 日期时间范围选择器
+.el-date-range-picker {
+  .el-date-table {
+    // 选中日期背景色
+    td.selected div {
+      background-color: #00d4ff;
+      color: #000;
+    }
+
+    // 起始日期
+    td.start-date span {
+      background-color: #00d4ff;
+      color: #000;
+    }
+
+    // 结束日期
+    td.end-date span {
+      background-color: #00d4ff;
+      color: #000;
+    }
+
+    // 范围内日期
+    td.in-range div {
+      background-color: rgba(0, 212, 255, 0.2);
+    }
+  }
+}
+
+// 搜索按钮区域
+.search-actions {
+  background-color: rgba(255, 255, 255, 0.03);
+  border-radius: 4px;
+  padding: 15px;
+  text-align: center;
+
+  .el-button {
+    &--primary {
+      background-color: #00d4ff;
+      border-color: #00d4ff;
+      color: #000;
+      font-weight: 500;
+
+      &:hover {
+        background-color: #33ddff;
+        border-color: #33ddff;
+      }
+    }
+
+    &--default {
+      background-color: rgba(255, 255, 255, 0.08);
+      border-color: #334155;
+      color: #cbd5e1;
+
+      &:hover {
+        background-color: rgba(0, 212, 255, 0.1);
+        border-color: #00d4ff;
+        color: #00d4ff;
+      }
+    }
+  }
+}
+
+// 部门选择器样式
+.department-selector {
+  .el-cascader {
+    .el-input__inner {
+      background-color: rgba(255, 255, 255, 0.08);
+      border: 1px solid #334155;
+      color: #e2e8f0;
+
+      &:focus {
+        border-color: #00d4ff;
+      }
+    }
+  }
+
+  .el-cascader-panel {
+    background-color: #1e1e2d;
+    border: 1px solid #334155;
+
+    .el-cascader-node {
+      color: #e2e8f0;
+
+      &:hover {
+        background-color: rgba(0, 212, 255, 0.1);
+      }
+
+      &.is-active {
+        color: #00d4ff;
+        font-weight: bold;
+      }
+    }
+  }
+}
+
+// 用户状态标签样式
+.el-tag {
+  &.el-tag--success {
+    background-color: rgba(0, 255, 157, 0.15);
+    border-color: rgba(0, 255, 157, 0.3);
+    color: #00ff9d;
+  }
+
+  &.el-tag--warning {
+    background-color: rgba(255, 170, 0, 0.15);
+    border-color: rgba(255, 170, 0, 0.3);
+    color: #ffaa00;
+  }
+
+  &.el-tag--danger {
+    background-color: rgba(255, 77, 77, 0.15);
+    border-color: rgba(255, 77, 77, 0.3);
+    color: #ff4d4d;
+  }
+
+  &.el-tag--info {
+    background-color: rgba(107, 114, 128, 0.15);
+    border-color: rgba(107, 114, 128, 0.3);
+    color: #6b7280;
+  }
+}
+
+// 表单元素适配深色主题
+.el-form {
+  .el-form-item__label {
+    color: #e2e8f0;
+  }
+
+  .el-input__inner,
+  .el-textarea__inner {
+    background-color: rgba(255, 255, 255, 0.08);
+    border: 1px solid #334155;
+    color: #e2e8f0;
+
+    &:focus {
+      border-color: #00d4ff;
+    }
+
+    &::placeholder {
+      color: #94a3b8;
+    }
+  }
+  ::v-deep .el-date-editor {
+    .el-range-input {
+      background-color: rgba(255, 255, 255, 0.08);  // 半透明深色背景
+      border: 1px solid rgba(64, 158, 255, 0.2);     // 科技蓝边框
+      color: #fff;                                   // 白色文字
+
+      &:focus {
+        border-color: #409eff;                       // 聚焦时的边框颜色
+        box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2); // 聚焦光晕效果
+      }
+
+      &::placeholder {
+        color: #909399;                             // 占位符颜色
+      }
+    }
+
+    // 范围分隔符颜色适配
+    .el-range-separator {
+      color: #e4e7ed;
+    }
+  }
+
+  .el-select-dropdown {
+    background-color: #1e1e2d;
+    border: 1px solid #334155;
+
+    .el-select-dropdown__item {
+      color: #e2e8f0;
+
+      &.selected {
+        color: #00d4ff;
+        font-weight: bold;
+      }
+
+      &:hover {
+        background-color: rgba(0, 212, 255, 0.1);
+      }
+    }
+  }
+}
+
+// 对话框样式适配
+.el-dialog {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+
+  .el-dialog__header {
+    background-color: rgba(0, 212, 255, 0.1);
+    border-bottom: 1px solid #334155;
+    color: #00d4ff;
+
+    .el-dialog__title {
+      color: #00d4ff;
+    }
+
+    .el-dialog__headerbtn {
+      .el-dialog__close {
+        color: #cbd5e1;
+
+        &:hover {
+          color: #00d4ff;
+        }
+      }
+    }
+  }
+
+  .el-dialog__body {
+    color: #e2e8f0;
+    padding: 20px;
+    background-color: #1e1e2d;
+  }
+
+  .el-dialog__footer {
+    background-color: rgba(255, 255, 255, 0.03);
+    border-top: 1px solid #334155;
+    padding: 15px 20px;
+  }
+}
+
+// 卡片组件进一步优化
+.el-card {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  color: #e2e8f0;
+
+  .el-card__header {
+    background-color: rgba(0, 212, 255, 0.05);
+    border-bottom: 1px solid #334155;
+    color: #00d4ff;
+  }
+
+  .el-card__body {
+    background-color: #1e1e2d;
+  }
+}
+
+// 下拉菜单样式
+.el-dropdown-menu {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+
+  .el-dropdown-menu__item {
+    color: #e2e8f0;
+
+    &:hover {
+      background-color: rgba(0, 212, 255, 0.1);
+      color: #00d4ff;
+    }
+  }
+}
+
+// 工具提示样式
+.el-tooltip__popper {
+  background-color: #1e1e2d;
+  color: #e2e8f0;
+  border: 1px solid #334155;
+
+  &[x-placement^="top"] .popper__arrow {
+    border-top-color: #334155;
+
+    &::after {
+      border-top-color: #1e1e2d;
+    }
+  }
+
+  &[x-placement^="bottom"] .popper__arrow {
+    border-bottom-color: #334155;
+
+    &::after {
+      border-bottom-color: #1e1e2d;
+    }
+  }
+}
+
+// 消息提示框样式
+.el-message {
+  background-color: #1e1e2d;
+  border: 1px solid #334155;
+  color: #e2e8f0;
+
+  &.el-message--success {
+    background-color: rgba(0, 255, 157, 0.15);
+    border-color: rgba(0, 255, 157, 0.3);
+    color: #00ff9d;
+  }
+
+  &.el-message--warning {
+    background-color: rgba(255, 170, 0, 0.15);
+    border-color: rgba(255, 170, 0, 0.3);
+    color: #ffaa00;
+  }
+
+  &.el-message--error {
+    background-color: rgba(255, 77, 77, 0.15);
+    border-color: rgba(255, 77, 77, 0.3);
+    color: #ff4d4d;
+  }
+}
+
+// 修复用户管理页面右侧数据区域背景问题
+.right-side-content,
+.right-panel,
+.user-management-right-panel {
+  background-color: #1e1e2d !important;
+
+  .el-card {
+    background-color: #1e1e2d;
+    border: 1px solid #334155;
+  }
+
+  .el-tabs {
+    .el-tabs__header {
+      background-color: rgba(255, 255, 255, 0.03);
+      border-bottom: 1px solid #334155;
+
+      .el-tabs__item {
+        color: #cbd5e1;
+
+        &.is-active {
+          color: #00d4ff;
+        }
+
+        &:hover {
+          color: #00d4ff;
+        }
+      }
+    }
+
+    .el-tabs__content {
+      background-color: #1e1e2d;
+    }
+  }
+}
+
+// 修复部门树区域背景问题
+.department-section,
+.dept-tree-container {
+  background-color: #1e1e2d !important;
+  border: 1px solid #334155;
+  border-radius: 4px;
+}
+
+// 修复搜索栏背景问题
+.search-section,
+.search-wrapper {
+  background-color: #1e1e2d !important;
+  border: 1px solid #334155;
+  border-radius: 4px;
+}
+
+// 通用容器背景修复
+.container,
+.wrapper,
+.panel {
+  background-color: #1e1e2d !important;
+}
+
+// 修复表格容器背景
+.table-container,
+.data-table-container {
+  background-color: #1e1e2d !important;
+  border: 1px solid #334155;
+  border-radius: 4px;
+}
+/* ========================================
+ * Vue Treeselect 组件科技感样式适配
+ * ======================================== */
+/* 全局覆盖vue-treeselect菜单样式 */
+.vue-treeselect__menu
+{
+  background-color: #1e1e2d !important;
+  border: 1px solid #334155 !important;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
+}
+
+.vue-treeselect {
+  &__control {
+    background-color: rgba(255, 255, 255, 0.08) !important;
+    border: 1px solid #334155 !important;
+    border-radius: 4px;
+    color: #e2e8f0;
+    min-height: 34px;
+
+    &:hover {
+      border-color: #00d4ff !important;
+    }
+
+    &--focused {
+      border-color: #00d4ff !important;
+      box-shadow: 0 0 0 2px rgba(0, 212, 255, 0.2) !important;
+    }
+  }
+
+  &__value-container {
+    color: #e2e8f0;
+
+    &--has-value {
+      .vue-treeselect__single-value {
+        color: #e2e8f0;
+      }
+    }
+  }
+
+  &__ indicators {
+    .vue-treeselect__indicator {
+      svg {
+        fill: #cbd5e1;
+      }
+    }
+  }
+
+  &__menu {
+    background-color: #1e1e2d;
+    border: 1px solid #334155;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    border-radius: 4px;
+    z-index: 1000;
   }
+
+  &__list {
+    background-color: #1e1e2d;
+  }
+
+  &__option {
+    background-color: #1e1e2d;
+    color: #e2e8f0;
+
+    &:hover {
+      background-color: rgba(0, 212, 255, 0.1);
+    }
+
+    &--selected {
+      background-color: rgba(0, 212, 255, 0.15);
+      color: #00d4ff;
+      font-weight: 500;
+    }
+
+    &--highlight {
+      background-color: rgba(0, 212, 255, 0.1);
+    }
+  }
+
+  &__label-container {
+    &:hover {
+      background-color: rgba(0, 212, 255, 0.1);
+    }
+  }
+
+  &__checkbox {
+    &--checked {
+      .vue-treeselect__checkbox__inner {
+        background-color: #00d4ff;
+        border-color: #00d4ff;
+      }
+    }
+  }
+}
+
+/* 确保菜单内的所有选项都有正确的样式 */
+.vue-treeselect__option {
+  background-color: #1e1e2d !important;
+  color: #e2e8f0 !important;
+}
+.vue-treeselect__single-value {
+  color: #94a3b8 !important;
+}
+.vue-treeselect__placeholder{
+  color: #94a3b8 !important;
 }
diff --git a/ruoyi-ui/src/assets/styles/ruoyi.scss b/ruoyi-ui/src/assets/styles/ruoyi.scss
index ab4a1d2..615aa51 100644
--- a/ruoyi-ui/src/assets/styles/ruoyi.scss
+++ b/ruoyi-ui/src/assets/styles/ruoyi.scss
@@ -125,8 +125,8 @@
 /* tree border */
 .tree-border {
   margin-top: 5px;
-  border: 1px solid #e5e6e7;
-  background: #FFFFFF none;
+  border: 1px solid #2a3a3a;
+  background:  var(--tech-card-bg) none;
   border-radius: 4px;
 }
 
@@ -283,5 +283,11 @@
 
 /* 分割面板样式 */
 .splitpanes.default-theme .splitpanes__pane {
-  background-color: #fff!important;
+  background-color: rgba(13, 23, 47, 0.85)!important;
 }
+//用户管理分隔符
+.splitpanes.default-theme .splitpanes__splitter {
+  background-color: #10a3c1 !important;
+  border-left: 1px solid #10a3c1 !important;
+}
+
diff --git a/ruoyi-ui/src/assets/styles/sidebar.scss b/ruoyi-ui/src/assets/styles/sidebar.scss
index 3558293..9d0cfa4 100644
--- a/ruoyi-ui/src/assets/styles/sidebar.scss
+++ b/ruoyi-ui/src/assets/styles/sidebar.scss
@@ -80,7 +80,7 @@
     .submenu-title-noDropdown,
     .el-submenu__title {
       &:hover {
-        background-color: rgba(0, 0, 0, 0.06) !important;
+        background-color: rgba(0, 212, 255, 0.1) !important;
       }
     }
 
@@ -93,16 +93,24 @@
       min-width: $base-sidebar-width !important;
 
       &:hover {
-        background-color: rgba(0, 0, 0, 0.06) !important;
+        background-color: rgba(0, 212, 255, 0.1) !important;
       }
     }
 
     & .theme-dark .nest-menu .el-submenu>.el-submenu__title,
     & .theme-dark .el-submenu .el-menu-item {
       background-color: $base-sub-menu-background !important;
+      color: hsla(0,0%,100%,.65);
 
       &:hover {
         background-color: $base-sub-menu-hover !important;
+        color: #00d4ff !important;
+      }
+
+      &.is-active {
+        color: #00d4ff !important;
+        background-color: rgba(0, 212, 255, 0.15) !important;
+        border-left: 3px solid #00d4ff;
       }
     }
   }
@@ -159,6 +167,10 @@
 
   .el-menu--collapse .el-menu .el-submenu {
     min-width: $base-sidebar-width !important;
+
+    .el-submenu__title.is-active {
+      background-color: rgba(0, 212, 255, 0.15) !important;
+    }
   }
 
   // mobile responsive
@@ -202,7 +214,7 @@
   .el-menu-item {
     &:hover {
       // you can use $subMenuHover
-      background-color: rgba(0, 0, 0, 0.06) !important;
+      background-color: rgba(0, 212, 255, 0.1) !important;
     }
   }
 
@@ -210,9 +222,10 @@
   >.el-menu--popup {
     max-height: 100vh;
     overflow-y: auto;
+    background-color: #16213e !important;
 
     &::-webkit-scrollbar-track-piece {
-      background: #d3dce6;
+      background: #000c17;
     }
 
     &::-webkit-scrollbar {
@@ -220,7 +233,7 @@
     }
 
     &::-webkit-scrollbar-thumb {
-      background: #99a9bf;
+      background: #00d4ff;
       border-radius: 20px;
     }
   }
diff --git a/ruoyi-ui/src/assets/styles/variables.scss b/ruoyi-ui/src/assets/styles/variables.scss
index 34484d4..7c1fde3 100644
--- a/ruoyi-ui/src/assets/styles/variables.scss
+++ b/ruoyi-ui/src/assets/styles/variables.scss
@@ -8,24 +8,10 @@ $tiffany: #4AB7BD;
 $yellow:#FEC171;
 $panGreen: #30B08F;
 
-// 默认菜单主题风格
-$base-menu-color:#bfcbd9;
-$base-menu-color-active:#f4f4f5;
-$base-menu-background:#304156;
-$base-logo-title-color: #ffffff;
-
-$base-menu-light-color:rgba(0,0,0,.70);
-$base-menu-light-background:#ffffff;
-$base-logo-light-title-color: #001529;
-
-$base-sub-menu-background:#1f2d3d;
-$base-sub-menu-hover:#001528;
-
-// 自定义暗色菜单风格
-/**
+// 科技感主题色配置
 $base-menu-color:hsla(0,0%,100%,.65);
-$base-menu-color-active:#fff;
-$base-menu-background:#001529;
+$base-menu-color-active:#00d4ff;
+$base-menu-background:#16213e;
 $base-logo-title-color: #ffffff;
 
 $base-menu-light-color:rgba(0,0,0,.70);
@@ -34,7 +20,6 @@ $base-logo-light-title-color: #001529;
 
 $base-sub-menu-background:#000c17;
 $base-sub-menu-hover:#001528;
-*/
 
 $base-sidebar-width: 200px;
 
diff --git a/ruoyi-ui/src/components/ImageUpload/index.vue b/ruoyi-ui/src/components/ImageUpload/index.vue
index 6b24f6e..d8983b8 100644
--- a/ruoyi-ui/src/components/ImageUpload/index.vue
+++ b/ruoyi-ui/src/components/ImageUpload/index.vue
@@ -256,7 +256,7 @@ export default {
 
 ::v-deep .el-upload-list--picture-card.is-disabled + .el-upload--picture-card {
   display: none !important;
-} 
+}
 
 // 去掉动画效果
 ::v-deep .el-list-enter-active,
diff --git a/ruoyi-ui/src/components/Pagination/index.vue b/ruoyi-ui/src/components/Pagination/index.vue
index 08ac487..63ca890 100644
--- a/ruoyi-ui/src/components/Pagination/index.vue
+++ b/ruoyi-ui/src/components/Pagination/index.vue
@@ -105,7 +105,7 @@ export default {
 
 <style scoped>
 .pagination-container {
-  background: #fff;
+  background: #1e1e2d;
 }
 .pagination-container.hidden {
   display: none;
diff --git a/ruoyi-ui/src/layout/components/Navbar.vue b/ruoyi-ui/src/layout/components/Navbar.vue
index 45ee588..21a4cc5 100644
--- a/ruoyi-ui/src/layout/components/Navbar.vue
+++ b/ruoyi-ui/src/layout/components/Navbar.vue
@@ -114,8 +114,9 @@ export default {
   height: 50px;
   overflow: hidden;
   position: relative;
-  background: #fff;
-  box-shadow: 0 1px 4px rgba(0,21,41,.08);
+  background: rgba(13, 23, 47, 0.85); // 深蓝科技感背景
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
+  border-bottom: 1px solid rgba(64, 158, 255, 0.2); // 科技蓝边框
 
   .hamburger-container {
     line-height: 46px;
@@ -123,10 +124,11 @@ export default {
     float: left;
     cursor: pointer;
     transition: background .3s;
-    -webkit-tap-highlight-color:transparent;
+    -webkit-tap-highlight-color: transparent;
+    color: #e4e7ed; // 图标颜色适配深色背景
 
     &:hover {
-      background: rgba(0, 0, 0, .025)
+      background: rgba(64, 158, 255, 0.1); // 科技蓝悬停效果
     }
   }
 
@@ -148,6 +150,7 @@ export default {
     float: right;
     height: 100%;
     line-height: 50px;
+    background: rgba(13, 23, 47, 0.85); /* 确保右侧菜单背景色 */
 
     &:focus {
       outline: none;
@@ -158,7 +161,7 @@ export default {
       padding: 0 8px;
       height: 100%;
       font-size: 18px;
-      color: #5a5e66;
+      color: #e4e7ed; // 浅色文字适配深色背景
       vertical-align: text-bottom;
 
       &.hover-effect {
@@ -166,7 +169,7 @@ export default {
         transition: background .3s;
 
         &:hover {
-          background: rgba(0, 0, 0, .025)
+          background: rgba(64, 158, 255, 0.1); // 科技蓝悬停效果
         }
       }
     }
@@ -185,6 +188,7 @@ export default {
           width: 30px;
           height: 30px;
           border-radius: 50%;
+          border: 1px solid rgba(64, 158, 255, 0.2); // 科技蓝边框
         }
 
         .user-nickname{
@@ -193,6 +197,7 @@ export default {
           left: 2px;
           font-size: 14px;
           font-weight: bold;
+          color: #e4e7ed; // 浅色文字适配深色背景
         }
 
         .el-icon-caret-bottom {
@@ -201,6 +206,7 @@ export default {
           right: -20px;
           top: 25px;
           font-size: 12px;
+          color: #e4e7ed; // 图标颜色适配深色背景
         }
       }
     }
diff --git a/ruoyi-ui/src/layout/components/Settings/index.vue b/ruoyi-ui/src/layout/components/Settings/index.vue
index 1023f7f..aa7fd23 100644
--- a/ruoyi-ui/src/layout/components/Settings/index.vue
+++ b/ruoyi-ui/src/layout/components/Settings/index.vue
@@ -271,12 +271,12 @@ export default {
       }
     }
   }
-
   .drawer-container {
     padding: 20px;
     font-size: 14px;
     line-height: 1.5;
     word-wrap: break-word;
+    background-color: #898b8d;
 
     .drawer-title {
       margin-bottom: 12px;
diff --git a/ruoyi-ui/src/layout/components/TagsView/index.vue b/ruoyi-ui/src/layout/components/TagsView/index.vue
index f0b0837..1109fe7 100644
--- a/ruoyi-ui/src/layout/components/TagsView/index.vue
+++ b/ruoyi-ui/src/layout/components/TagsView/index.vue
@@ -240,10 +240,9 @@ export default {
 <style lang="scss" scoped>
 .tags-view-container {
   height: 34px;
-  width: 100%;
-  background: #fff;
-  border-bottom: 1px solid #d8dce5;
-  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04);
+  border-bottom: 1px solid rgba(64, 158, 255, 0.2);
+  background: rgba(13, 23, 47, 0.85);
+  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);
   .tags-view-wrapper {
     .tags-view-item {
       display: inline-block;
@@ -251,13 +250,14 @@ export default {
       cursor: pointer;
       height: 26px;
       line-height: 26px;
-      border: 1px solid #d8dce5;
-      color: #495060;
-      background: #fff;
-      padding: 0 8px;
+      border: 1px solid rgba(64, 158, 255, 0.3);
+      color: #e4e7ed;
+      background: rgba(255, 255, 255, 0.08);
+      padding: 0 12px;
       font-size: 12px;
       margin-left: 5px;
       margin-top: 4px;
+      border-radius: 4px;
       &:first-of-type {
         margin-left: 15px;
       }
@@ -265,9 +265,9 @@ export default {
         margin-right: 15px;
       }
       &.active {
-        background-color: #42b983;
-        color: #fff;
-        border-color: #42b983;
+        background: linear-gradient(135deg, #1a73e8, #0d47a1);
+        color: #ffffff;
+        border-color: #1a73e8;
         &::before {
           content: '';
           background: #fff;
@@ -279,6 +279,10 @@ export default {
           margin-right: 2px;
         }
       }
+      &:hover {
+        background: rgba(64, 158, 255, 0.2);
+        color: #ffffff;
+      }
     }
   }
 
@@ -303,7 +307,7 @@ export default {
       padding: 7px 16px;
       cursor: pointer;
       &:hover {
-        background: #eee;
+        background: rgba(0, 212, 255, 0.1);
       }
     }
   }
@@ -327,6 +331,7 @@ export default {
         display: inline-block;
         vertical-align: -3px;
       }
+
       &:hover {
         background-color: #b4bccc;
         color: #fff;
diff --git a/ruoyi-ui/src/views/login.vue b/ruoyi-ui/src/views/login.vue
index dde986d..86d1a36 100644
--- a/ruoyi-ui/src/views/login.vue
+++ b/ruoyi-ui/src/views/login.vue
@@ -167,44 +167,109 @@ export default {
   background-image: url("../assets/images/login-background.jpg");
   background-size: cover;
 }
-.title {
-  margin: 0px auto 30px auto;
-  text-align: center;
-  color: #707070;
-}
 
 .login-form {
-  border-radius: 6px;
-  background: #ffffff;
-  width: 400px;
-  padding: 25px 25px 5px 25px;
+  border-radius: 12px;
+  background: rgba(13, 23, 47, 0.85); /* 深蓝科技感背景 */
+  width: 420px;
+  padding: 30px 30px 20px 30px;
+  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
+  backdrop-filter: blur(10px);
+  border: 1px solid rgba(64, 158, 255, 0.3);
   z-index: 1;
-  .el-input {
-    height: 38px;
-    input {
-      height: 38px;
-    }
-  }
-  .input-icon {
-    height: 39px;
-    width: 14px;
-    margin-left: 2px;
-  }
 }
+
+.login-header {
+  text-align: center;
+  margin-bottom: 25px;
+}
+
+.login-title {
+  color: #409eff; /* 科技蓝 */
+  font-size: 24px;
+  font-weight: 600;
+  margin-bottom: 8px;
+}
+
+.login-subtitle {
+  color: #c0c4cc; /* 浅灰色 */
+  font-size: 14px;
+  margin: 0;
+}
+
 .login-tip {
   font-size: 13px;
   text-align: center;
   color: #bfbfbf;
 }
+
 .login-code {
-  width: 33%;
-  height: 38px;
+  width: 37%;
+  height: 46px;
   float: right;
+
   img {
+    margin-left: 1px;
     cursor: pointer;
     vertical-align: middle;
+    border-radius: 8px;
+    height: 46px;
+  }
+}
+
+/* 输入框样式调整 */
+.el-input {
+  height: 46px;
+
+  ::v-deep .el-input__inner {
+    height: 46px;
+    background-color: rgba(255, 255, 255, 0.08);
+    border: 1px solid rgba(64, 158, 255, 0.2);
+    color: #fff;
+    border-radius: 8px;
+
+    &::placeholder {
+      color: #909399;
+    }
+  }
+
+  ::v-deep .el-input__prefix {
+    left: 12px;
+  }
+
+  .input-icon {
+    height: 46px;
+    width: 14px;
+    margin-left: 0;
+  }
+}
+
+/* 复选框颜色调整 */
+::v-deep .el-checkbox {
+  color: #e4e7ed;
+
+  .el-checkbox__label {
+    color: #e4e7ed;
+  }
+}
+
+/* 按钮样式 */
+::v-deep .el-button--primary {
+  height: 46px;
+  border-radius: 8px;
+  background: linear-gradient(135deg, #1a73e8, #0d47a1);
+  border: none;
+  font-size: 16px;
+  font-weight: 500;
+  letter-spacing: 1px;
+
+  &:hover {
+    background: linear-gradient(135deg, #0d47a1, #1a73e8);
+    transform: translateY(-2px);
+    box-shadow: 0 6px 16px rgba(26, 115, 232, 0.3);
   }
 }
+
 .el-login-footer {
   height: 40px;
   line-height: 40px;
@@ -217,7 +282,9 @@ export default {
   font-size: 12px;
   letter-spacing: 1px;
 }
+
 .login-code-img {
-  height: 38px;
+  height: 46px;
+  border-radius: 8px;
 }
 </style>
diff --git a/ruoyi-ui/src/views/system/user/index.vue b/ruoyi-ui/src/views/system/user/index.vue
index 14a0ab1..a86b168 100644
--- a/ruoyi-ui/src/views/system/user/index.vue
+++ b/ruoyi-ui/src/views/system/user/index.vue
@@ -555,4 +555,4 @@ export default {
     }
   }
 }
-</script>
\ No newline at end of file
+</script>
diff --git a/ruoyi-ui/src/views/system/user/profile/userAvatar.vue b/ruoyi-ui/src/views/system/user/profile/userAvatar.vue
index 59afb35..f8bf6da 100644
--- a/ruoyi-ui/src/views/system/user/profile/userAvatar.vue
+++ b/ruoyi-ui/src/views/system/user/profile/userAvatar.vue
@@ -171,7 +171,7 @@ export default {
   right: 0;
   top: 0;
   bottom: 0;
-  color: #eee;
+  color: #94a3b8;
   background: rgba(0, 0, 0, 0.5);
   font-size: 24px;
   font-style: normal;