diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index 8e3af82b..fa365f31 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -1,8 +1,8 @@
 <template>
-  <el-card style="background-color: rgb(41, 51, 61)">
+  <el-card style="min-height:calc(100vh - 84px);background: url('../../../static/bg.jpg') no-repeat;background-size:100% 100%">
     <div class="dashboard-container">
       <div class="sudoku_row" >
-        <div class="dashboard-text" style="color:white">name:{{ name }}</div>
+        <div class="dashboard-text" style="color:white">用户名：{{ name }}</div>
         <el-divider content-position="right">消息通知</el-divider>
         <el-card v-for="(sudoku,index) in sudokus" :class="curSelect==sudoku.id?'opacity':''" :key="index" shadow="hover" class="sudoku_item ">
           <div>
@@ -17,9 +17,9 @@
         <div v-for="(value1,index1) in fathers" :key="index1" style="width:100%">
           <el-divider content-position="left">{{ value1.title }}</el-divider>
           <router-link v-for="(value2,index2) in sons" v-if="value2.pid === value1.id" :key="index2" :to="value2.path">
-            <el-card shadow="hover" class="sudoku_item" style="height:160px;width:170px;margin: 5px;display: inline-block;background: #0F2027;background: -webkit-linear-gradient(to right, #2C5364, #203A43, #0F2027);background: linear-gradient(to right, #2C5364, #203A43, #0F2027);">
-              <svg-icon :icon-class="value2.icon" class="bgc" style="display:block;margin: auto;border: 0 solid black;color:white;width:70px;height:70px" /><br>
-              <div style="color:white;text-align:center">{{ value2.title }}</div>
+            <el-card shadow="hover" class="sudoku_item" style="height:150px;width:170px;margin: 5px;display: inline-block;background: rgba(255,255,255,0.4)">
+              <svg-icon :icon-class="value2.icon" :style="{color:Color(index2)}" class="bgc" style="display:block;margin: auto;border: 0 solid black;width:70px;height:70px"/><br>
+              <div style="color:black;text-align:center">{{ value2.title }}</div>
             </el-card>
           </router-link>
         </div>
@@ -78,6 +78,10 @@ export default {
         })
       })
     },
+    Color(index) {
+      const colorAngle = Math.floor(Math.random() * 360 + index)
+      return 'hsla(' + colorAngle + ',70%,30%,1)'
+    },
     async initSecondModule() {
       await request({
         url: '',
@@ -138,8 +142,9 @@ export default {
 </script>
 <style rel="stylesheet/scss" lang="scss">
   .dashboard-container .el-divider__text {
-    color: white;
-    background-color: rgb(41,51,61);
+    color: gray;
+    font-size: 22px;
+    background-color: rgba(255,255,255,0.8);
   }
 </style>
 <style rel="stylesheet/scss" lang="scss" scoped>
@@ -183,8 +188,11 @@ export default {
     flex-direction: column;
     width:15%;
     height: 80px;
-    padding-top: 10px;
-    padding-bottom: 10px;
+    /*padding-top: 10px;*/
+    /*padding-bottom: 10px;*/
+  }
+  .sudoku_item:hover {
+    border: 2px solid white;
   }
   .opacity{
     opacity: 0.4;
diff --git a/src/views/layout/components/AppMain.vue b/src/views/layout/components/AppMain.vue
index 03f99822..580a245e 100644
--- a/src/views/layout/components/AppMain.vue
+++ b/src/views/layout/components/AppMain.vue
@@ -24,8 +24,8 @@ export default {
 <style scoped>
 .app-main {
   /*50 = navbar  */
-  min-height: calc(100% - 50px);
   position: relative;
   overflow: hidden;
+  min-height:calc(100vh - 50px);background: url('../../../../static/bg.jpg') repeat;
 }
 </style>
diff --git a/src/views/layout/components/Navbar.vue b/src/views/layout/components/Navbar.vue
index 8461a64c..ff9c4ed6 100644
--- a/src/views/layout/components/Navbar.vue
+++ b/src/views/layout/components/Navbar.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-menu class="navbar" mode="horizontal">
+  <el-menu class="navbar" mode="horizontal" style="background: rgb(163,173,182)!important;">
     <hamburger :toggle-click="toggleSideBar" :is-active="sidebar.opened" class="hamburger-container"/>
     <breadcrumb />
     <el-dropdown class="avatar-container" trigger="click">
diff --git a/src/views/layout/components/TagsView.vue b/src/views/layout/components/TagsView.vue
index 92ed972e..1b2febfc 100644
--- a/src/views/layout/components/TagsView.vue
+++ b/src/views/layout/components/TagsView.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="tags-view-container">
-    <scroll-pane ref="scrollPane" class="tags-view-wrapper">
+    <scroll-pane ref="scrollPane" class="tags-view-wrapper" style="background: rgb(163,173,182)!important;">
       <router-link v-for="tag in Array.from(visitedViews)" ref="tag" :class="isActive(tag)?'active':''" :to="tag.path" :key="tag.path" class="tags-view-item" @contextmenu.prevent.native="openMenu(tag,$event)" >
         {{ tag.title }}
         <span class="el-icon-close" @click.prevent.stop="closeSelectedTag(tag)"/>
diff --git a/static/bg.jpg b/static/bg.jpg
new file mode 100644
index 00000000..8fdf90e5
Binary files /dev/null and b/static/bg.jpg differ