diff --git a/assets/static/css/index-color.css b/assets/static/css/index-color.css
new file mode 100644
index 0000000..f7e29e4
--- /dev/null
+++ b/assets/static/css/index-color.css
@@ -0,0 +1,128 @@
+header {
+    background-color: #58b7ff;
+    color: #fff;
+}
+
+.layui-btn {
+    background-color: #409eff;
+}
+
+.layui-layer-btn .layui-layer-btn0 {
+    background-color: #409eff;
+}
+
+.layui-btn-primary {
+    background-color: transparent;
+}
+
+.layui-btn-primary:hover {
+    border-color: #79bbff;
+}
+
+.layui-input:focus,
+.layui-textarea:focus {
+    border-color: #79bbff !important;
+    box-shadow: none;
+}
+
+.layui-form-danger + .layui-form-select .layui-input,
+.layui-form-danger:focus {
+    border-color: #ff5722 !important;
+}
+
+.layui-laypage .layui-laypage-curr .layui-laypage-em {
+    background-color: #409eff;
+}
+
+.layui-laypage input:focus, .layui-laypage select:focus {
+    border-color: #79bbff !important;
+    box-shadow: none;
+}
+
+.layui-table-view .layui-table td[data-edit]:hover:after {
+    border-color: #79bbff;
+}
+
+.layui-form-checkbox[lay-skin=primary]:hover > i {
+    border-color: #79bbff;
+}
+
+.layui-form-checked[lay-skin=primary] > i {
+    background-color: #409eff;
+    border-color: #409eff !important;
+}
+
+.layui-table-checked {
+    background-color: #ecf5ff;
+}
+
+.layui-table-checked:hover {
+    background-color: #d9ecff;
+}
+
+.layui-table-cell-c:hover{
+    border-color: #79bbff;
+}
+
+@media (prefers-color-scheme: dark) {
+    header {
+        background-color: #395c74;
+    }
+
+    .layui-btn {
+        background-color: #4f80a1;
+    }
+
+    .layui-layer-btn .layui-layer-btn0 {
+        background-color: #4f80a1;
+    }
+
+    .layui-btn-primary {
+        background-color: transparent;
+        border-color: #484849;
+    }
+
+    .layui-btn-primary:hover {
+        border-color: #5f5f60;
+    }
+
+    .layui-input:focus,
+    .layui-textarea:focus {
+        border-color: #5f5f60 !important;
+        box-shadow: none;
+    }
+
+    .layui-laypage .layui-laypage-curr .layui-laypage-em {
+        background-color: #4f80a1;
+    }
+
+    .layui-laypage input:focus, .layui-laypage select:focus {
+        border-color: #5f5f60 !important;
+        box-shadow: none;
+    }
+
+    .layui-table-view .layui-table td[data-edit]:hover:after {
+        border-color: #5f5f60;
+    }
+
+    .layui-form-checkbox[lay-skin=primary]:hover > i {
+        border-color: #5f5f60;
+    }
+
+    .layui-form-checked[lay-skin=primary] > i {
+        background-color: #484849;
+        border-color: #484849 !important;
+    }
+
+    .layui-table-checked {
+        background-color: rgba(255, 255, 255, .04);
+    }
+
+    .layui-table-checked:hover {
+        background-color: rgba(255, 255, 255, .08);
+    }
+
+    .layui-table-cell-c:hover{
+        border-color: #5f5f60;
+    }
+}
\ No newline at end of file
diff --git a/assets/static/css/index.css b/assets/static/css/index.css
index a749426..d0e17c1 100644
--- a/assets/static/css/index.css
+++ b/assets/static/css/index.css
@@ -3,11 +3,6 @@ html, body {
     word-break: break-all;
 }
 
-header {
-    background-color: #58b7ff;
-    color: #fff;
-}
-
 header .title {
     padding: 10px 15px;
     line-height: 40px;
@@ -69,122 +64,4 @@ section {
 
 .layui-table-page {
     margin-bottom: 0;
-}
-
-/*以下重置用到的layui组件的颜色*/
-
-.layui-btn {
-    background-color: #409eff;
-}
-
-.layui-layer-btn .layui-layer-btn0 {
-    background-color: #409eff;
-}
-
-.layui-btn-primary {
-    background-color: transparent;
-}
-
-.layui-btn-primary:hover {
-    border-color: #79bbff;
-}
-
-.layui-input:focus,
-.layui-textarea:focus {
-    border-color: #79bbff !important;
-    box-shadow: none;
-}
-
-.layui-form-danger + .layui-form-select .layui-input,
-.layui-form-danger:focus {
-    border-color: #ff5722 !important;
-}
-
-.layui-laypage .layui-laypage-curr .layui-laypage-em {
-    background-color: #409eff;
-}
-
-.layui-laypage input:focus, .layui-laypage select:focus {
-    border-color: #79bbff !important;
-    box-shadow: none;
-}
-
-.layui-table-view .layui-table td[data-edit]:hover:after {
-    border-color: #79bbff;
-}
-
-.layui-form-checkbox[lay-skin=primary]:hover > i {
-    border-color: #79bbff;
-}
-
-.layui-form-checked[lay-skin=primary] > i {
-    background-color: #409eff;
-    border-color: #409eff !important;
-}
-
-.layui-table-checked {
-    background-color: #ecf5ff;
-}
-
-.layui-table-checked:hover {
-    background-color: #d9ecff;
-}
-
-@media (prefers-color-scheme: dark) {
-    header {
-        background-color: #395c74;
-    }
-
-    .layui-btn {
-        background-color: #4f80a1;
-    }
-
-    .layui-layer-btn .layui-layer-btn0 {
-        background-color: #4f80a1;
-    }
-
-    .layui-btn-primary {
-        background-color: transparent;
-        border-color: #666;
-    }
-
-    .layui-btn-primary:hover {
-        border-color: #666;
-    }
-
-    .layui-input:focus,
-    .layui-textarea:focus {
-        border-color: #666 !important;
-        box-shadow: none;
-    }
-
-    .layui-laypage .layui-laypage-curr .layui-laypage-em {
-        background-color: #4f80a1;
-    }
-
-    .layui-laypage input:focus, .layui-laypage select:focus {
-        border-color: #666 !important;
-        box-shadow: none;
-    }
-
-    .layui-table-view .layui-table td[data-edit]:hover:after {
-        border-color: #666;
-    }
-
-    .layui-form-checkbox[lay-skin=primary]:hover > i {
-        border-color: #666;
-    }
-
-    .layui-form-checked[lay-skin=primary] > i {
-        background-color: #4f80a1;
-        border-color: #4f80a1 !important;
-    }
-
-    .layui-table-checked {
-        background-color: rgba(255, 255, 255, .04);
-    }
-
-    .layui-table-checked:hover {
-        background-color: rgba(255, 255, 255, .08);
-    }
 }
\ No newline at end of file
diff --git a/assets/templates/index.html b/assets/templates/index.html
index 4125e15..c660bba 100644
--- a/assets/templates/index.html
+++ b/assets/templates/index.html
@@ -5,6 +5,7 @@
     <link rel="stylesheet" href="./static/layui/css/layui.css">
     <link rel="stylesheet" href="./static/css/layui-theme-dark.css">
     <link rel="stylesheet" href="./static/css/index.css">
+    <link rel="stylesheet" href="./static/css/index-color.css">
     <script src="./static/layui/layui.js"></script>
     <script src="./static/js/index.js"></script>
     <style>