diff --git a/src/main/java/com/light/layout/MenuPane.java b/src/main/java/com/light/layout/MenuPane.java
index b56ba7ded12124791ed1d43b67e5d18dbb8feb6f..95bc34872a5e62163df6b65d060b209261dc75f3 100644
--- a/src/main/java/com/light/layout/MenuPane.java
+++ b/src/main/java/com/light/layout/MenuPane.java
@@ -54,7 +54,10 @@ public class MenuPane extends StackPane {
         VBox.setVgrow(dynamicMenu, Priority.ALWAYS);
 
         // 添加样式
-        this.dynamicMenu.getStyleClass().addAll("menu");
+        this.asideContainer.getStyleClass().add("aside");
+        this.dynamicMenu.getStyleClass().add("menu");
+        this.userLabel.getStyleClass().add("user-label");
+        this.emailLabel.getStyleClass().add("email-label");
 
         // 加上监听
         dynamicMenu.getSelectionModel().selectedItemProperty().addListener((observable, oldValue, newValue) -> {
diff --git a/src/main/resources/css/colors.css b/src/main/resources/css/colors.css
new file mode 100644
index 0000000000000000000000000000000000000000..bbb74ae0866db4c02bc74d78e692ca8caf988c84
--- /dev/null
+++ b/src/main/resources/css/colors.css
@@ -0,0 +1,14 @@
+
+/*颜色*/
+
+*{
+    -cf-primary-color: #6690FF;
+    -cf-success-color: #33C651;
+    -cf-info-color: #52A8F9;
+    -cf-warn-color: #FFA10A;
+    -cf-danger-color: #FF4C3F;
+
+    -cf-text-color:#303133;
+    -cf-border-color:#CDD0D6;
+    -cf-base-color:#F2F3F5;
+}
\ No newline at end of file
diff --git a/src/main/resources/css/menu.css b/src/main/resources/css/menu.css
index 5f1ad56b661f13f8e1d8b63eb2e466dbd3d14add..72b0fa2c35d94a91d04779daf485a13e72cbb4fc 100644
--- a/src/main/resources/css/menu.css
+++ b/src/main/resources/css/menu.css
@@ -1,5 +1,18 @@
+@import "colors.css";
+
+.aside {
+    /*-fx-min-width: 220px;
+    -fx-max-width: 220px;*/
+    -fx-pref-width: 220px;
+    -fx-border-width: 0 1px 0 0;
+    -fx-border-color: -cf-border-color;
+    -fx-spacing: 5px;
+    -fx-alignment: top-center;
+    -fx-padding: 10px;
+}
+
 /*导航栏Item样式*/
-.nav-item{
+.nav-item {
     -fx-background-radius: 3px;
     -fx-min-height: 40px;
     -fx-pref-height: 40px;
@@ -8,49 +21,136 @@
     -fx-padding: 0 10px;
     -fx-cursor: hand;
 }
-.nav-item > .icon-label > .ikonli-font-icon{
+
+.nav-item > .icon-label > .ikonli-font-icon {
     -fx-icon-size: 20px;
-    -fx-icon-color: derive(#303133,30%);
+    -fx-icon-color: derive(-cf-text-color, 30%);
 }
-.nav-item > .name-label{
+
+.nav-item > .name-label {
     -fx-font-size: 14px;
     -fx-pref-height: 30px;
     -fx-font-weight: bolder;
-    -fx-text-fill: derive(#303133,30%);
+    -fx-text-fill: derive(-cf-text-color, 30%);
 }
-.nav-item:hover > .name-label{
-    -fx-text-fill: #6690FF;
+
+.nav-item:hover > .name-label {
+    -fx-text-fill: -cf-primary-color;
 }
-.nav-item:hover > .icon-label > .ikonli-font-icon{
-    -fx-icon-color: #6690FF;
+
+.nav-item:hover > .icon-label > .ikonli-font-icon {
+    -fx-icon-color: -cf-primary-color;
 }
+
 /*动态导航栏*/
-.menu{
+.menu {
     -fx-background-insets: 0px;
-    -fx-background-color:transparent;
-    -fx-padding:5px 0 5px 0;
+    -fx-background-color: transparent;
+    -fx-padding: 0 0 5px 0;
+    -fx-border-width: 0;
+}
+
+.menu .scroll-bar {
+    -fx-opacity: 0;
+}
+
+.menu:hover .scroll-bar {
+    -fx-opacity: 1;
+}
+
+.menu .cell.indexed-cell.list-cell {
+    -fx-background-color: transparent;
+    -fx-padding: 0px;
+}
+
+.menu .cell.indexed-cell.list-cell:empty:hover {
+    -fx-background-color: transparent;
+}
+
+.menu .cell.indexed-cell.list-cell:hover {
+}
+
+.menu .cell.indexed-cell.list-cell:selected {
+}
+
+.menu .cell.indexed-cell.list-cell:selected .nav-item {
+    -fx-background-color: rgba(0, 0, 0, 0.1);
+}
+
+.menu .cell.indexed-cell.list-cell:selected .name-label {
+    -fx-text-fill: -cf-primary-color;
+}
+
+.menu .cell.indexed-cell.list-cell:selected .icon-label > .ikonli-font-icon {
+    -fx-icon-color: -cf-primary-color;
 }
-.menu .scroll-bar{
-    -fx-opacity:0;
+
+.user-label, .email-label {
+    -fx-font-size: 13px;
+    -fx-font-weight: bolder;
+    -fx-text-fill: -cf-text-color;
+}
+
+.email-label {
+    -fx-font-weight: lighter;
+    -fx-text-fill: derive(-cf-text-color, 40%);
+}
+
+/* 滚动条样式 */
+.scroll-bar-style {
+    -fx-background-color: transparent;
+}
+
+.scroll-bar-style > .viewport {
+    -fx-background-color: transparent;
+}
+
+.scroll-bar-style .scroll-bar {
+    /*-fx-block-increment:10000;*/
+    -fx-unit-increment: 20;
+    -fx-background-color: transparent;
 }
-.menu:hover .scroll-bar{
-    -fx-opacity:1;
+
+.scroll-bar-style .scroll-bar > .decrement-button > .decrement-arrow,
+.scroll-bar-style .scroll-bar > .increment-button > .increment-arrow {
+    -fx-background-color: transparent;
 }
-.menu .cell.indexed-cell.list-cell{
-    -fx-background-color:transparent;
-    -fx-padding:0px;
+
+.scroll-bar-style .scroll-bar:vertical > .decrement-button,
+.scroll-bar-style .scroll-bar:vertical > .increment-button {
+    -fx-pref-height: 0px;
+    -fx-pref-width: 0.01px;
+}
+
+.scroll-bar-style .scroll-bar:horizontal > .decrement-button,
+.scroll-bar-style .scroll-bar:horizontal > .increment-button {
+    -fx-pref-width: 0px;
+    -fx-pref-height: 0.01px;
+}
+
+.scroll-bar-style .scroll-bar > .track {
+    -fx-background-radius: 0px;
+    -fx-background-color: transparent;
+}
+
+.scroll-bar-style .scroll-bar:vertical > .thumb, .scroll-bar-style .scroll-bar:horizontal > .thumb {
+    -fx-background-color: rgba(0, 0, 0, 0.2);
+    -fx-background-insets: 0px;
+    -fx-background-radius: 3px;
 }
-.menu .cell.indexed-cell.list-cell:empty:hover{
-    -fx-background-color:transparent;
+
+.scroll-bar-style .scroll-bar:vertical {
+    -fx-padding: 6px 0px 6px 0px;
 }
-.menu .cell.indexed-cell.list-cell:hover{}
-.menu .cell.indexed-cell.list-cell:selected{}
-.menu .cell.indexed-cell.list-cell:selected .nav-item{
-    -fx-background-color: rgba(0,0,0,0.1);
+
+.scroll-bar-style .scroll-bar:horizontal {
+    -fx-padding: 0px 6px 0px 6px;
 }
-.menu .cell.indexed-cell.list-cell:selected .name-label{
-    -fx-text-fill: #6690FF;
+
+.scroll-bar-style .scroll-bar:vertical > .thumb, .scroll-bar-style .scroll-bar:vertical > .track {
+    -fx-background-insets: 0px 0px 0px -6px;
 }
-.menu .cell.indexed-cell.list-cell:selected .icon-label > .ikonli-font-icon{
-    -fx-icon-color: #6690FF;
+
+.scroll-bar-style .scroll-bar:horizontal > .thumb, .scroll-bar-style .scroll-bar:horizontal > .track {
+    -fx-background-insets: -6px 0px 0px 0px;
 }
\ No newline at end of file