diff --git a/public/images/cn-logo-medium.svg b/public/images/cn-logo-medium.svg
new file mode 100644
index 00000000..90d1bb06
--- /dev/null
+++ b/public/images/cn-logo-medium.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="46px" height="46px" viewBox="0 0 46 46" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>CN logo</title>
+    <defs>
+        <linearGradient x1="102.04782%" y1="56.9424939%" x2="19.4834391%" y2="48.0080387%" id="linearGradient-1">
+            <stop stop-color="#00C4FF" offset="0%"></stop>
+            <stop stop-color="#0091FF" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="161.459445%" y1="70.748361%" x2="8.14034479%" y2="55.8960313%" id="linearGradient-2">
+            <stop stop-color="#00C4FF" offset="0%"></stop>
+            <stop stop-color="#0091FF" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="0%" y1="53.0199687%" x2="97.1198342%" y2="56.1376398%" id="linearGradient-3">
+            <stop stop-color="#0091FF" offset="0%"></stop>
+            <stop stop-color="#4C8CCF" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Cyber-Narrator" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="编组-5" transform="translate(2.000000, 10.000000)">
+            <g id="眼睛(1)" fill="url(#linearGradient-1)" fill-rule="nonzero">
+                <path d="M21.0230998,3.83625773e-07 C22.9018946,-0.000358154962 24.7692368,0.250604364 26.5576703,0.743822531 C28.3474071,1.23616739 29.9418273,1.88710409 31.296695,2.67855189 C32.6526943,3.47034188 33.942989,4.35521655 35.1318642,5.30856435 C36.3322894,6.27118069 37.3471836,7.23989998 38.1483213,8.18782925 C39.0264141,9.22550649 39.7188428,10.0855985 40.265117,10.8173284 C40.8995965,11.6664978 41.3186552,12.2793336 41.583937,12.7458692 L41.583937,12.7458692 L42,13.5002428 L41.9975369,13.5048058 L41.7387124,13.9783284 C41.4937052,14.3901766 41.2357743,14.7962864 40.9652013,15.1962146 C40.5970021,15.7590288 40.1723848,16.3524721 39.667251,17.0102818 C39.2119782,17.6027554 38.5997996,18.3119556 37.8475909,19.1181475 C37.1152363,19.9045676 36.3376104,20.6592396 35.5176046,21.3793576 C34.7149025,22.0819985 33.7565262,22.7932805 32.6691039,23.4934403 C31.5527235,24.2128787 30.4163388,24.823376 29.2915373,25.3080209 C28.1406071,25.8042728 26.8687191,26.2025918 25.4031786,26.5256504 C23.9758493,26.8403815 22.5048501,27.0000004 21.0310882,27.0000004 L21.0310882,27.0000004 L21,27.0000004 C19.0947974,27.0000004 17.2246772,26.7497494 15.4415309,26.2561783 C13.6367492,25.7560479 12.043494,25.1070789 10.7059678,24.3273523 C9.29125365,23.502167 8.03684022,22.6477217 6.87109813,21.7151639 C5.66634596,20.7522624 4.65022017,19.7886194 3.85097969,18.8509854 C3.00650485,17.8603067 2.31304425,17.0040647 1.73095541,16.2333785 C1.13938033,15.4507429 0.69549099,14.800947 0.411602857,14.3020143 L0.411602857,14.3020143 L0,13.5602744 L0.261320879,13.0789663 C0.366135462,12.8847547 0.619135094,12.4844678 1.03479871,11.8552338 C1.44378161,11.236227 1.87678411,10.6290985 2.33308186,10.0348639 C2.78535904,9.44641144 3.39763741,8.73316163 4.1529749,7.91496342 C4.88162262,7.122087 5.65950775,6.36335724 6.48326079,5.64206068 C7.28889198,4.93967642 8.24726826,4.22619845 9.33172826,3.52141866 C10.4405529,2.8014955 11.5768377,2.18905887 12.7090618,1.70107736 C13.8730397,1.19917878 15.1813417,0.787370398 16.5976869,0.477059667 C18.0359369,0.16070529 19.5148789,0.000430503856 20.999767,3.83625773e-07 L20.999767,3.83625773e-07 Z M21,2 C14.372583,2 9,7.372583 9,14 C9,20.627417 14.372583,26 21,26 C27.627417,26 33,20.627417 33,14 C33,7.372583 27.627417,2 21,2 Z" id="形状结合"></path>
+            </g>
+            <g id="编组-4" transform="translate(13.000000, 7.000000)" fill="url(#linearGradient-2)">
+                <path d="M1.69573643,8.04225352 L1.69573643,10.915493 L0.474806202,10.915493 L0.474806202,8.04225352 L1.69573643,8.04225352 Z M3.61434109,9.22535211 L3.61434109,10.915493 L2.39341085,10.915493 L2.39341085,9.22535211 L3.61434109,9.22535211 Z M5.53294574,6.35211268 L5.53294574,10.915493 L4.3120155,10.915493 L4.3120155,6.35211268 L5.53294574,6.35211268 Z M7.8003876,8.38028169 L7.8003876,10.915493 L6.57945736,10.915493 L6.57945736,8.38028169 L7.8003876,8.38028169 Z M10.0678295,5.33802817 L10.0678295,10.915493 L8.84689922,10.915493 L8.84689922,5.33802817 L10.0678295,5.33802817 Z M12.3352713,2.12676056 L12.3352713,10.915493 L11.1143411,10.915493 L11.1143411,2.12676056 L12.3352713,2.12676056 Z M14.9515504,0.774647887 L14.9515504,10.915493 L13.7306202,10.915493 L13.7306202,0.774647887 L14.9515504,0.774647887 Z" id="形状结合"></path>
+            </g>
+            <path d="M13,15.2685812 C13.3935884,14.3665795 13.7710632,13.9155786 14.1324244,13.9155786 C14.6744661,13.9155786 15.3553514,15.5388801 16.026866,15.2685812 C16.6983805,14.9982822 16.5324475,12.492122 17.5396648,12.2858641 C18.5468821,12.0796062 19.2461805,14.5177152 20.4467516,13.9155786 C20.9219825,13.6772304 21.3038921,11.9603124 22.5685587,10.3456709 C23.3015095,9.40988851 24.6327728,8.26734662 26.5623484,6.91804528" id="直线-2" stroke="#0E97FF" stroke-width="0.2" stroke-linecap="square"></path>
+            <path d="" id="三角形" stroke="#0091FF" fill="#0091FF" transform="translate(26.924045, 6.688984) rotate(58.000000) translate(-26.924045, -6.688984) "></path>
+            <circle id="椭圆形" stroke="url(#linearGradient-3)" stroke-width="0.4" cx="21" cy="14" r="10.8"></circle>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index 326cc6dc..3cb41ce2 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <link rel="icon" href="<%= BASE_URL %>images/cn-logo-medium.svg">
     <title>Cyber Narrator</title>
   </head>
   <body>
diff --git a/src/assets/img/cn-logo-medium.svg b/src/assets/img/cn-logo-medium.svg
new file mode 100644
index 00000000..90d1bb06
--- /dev/null
+++ b/src/assets/img/cn-logo-medium.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="46px" height="46px" viewBox="0 0 46 46" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>CN logo</title>
+    <defs>
+        <linearGradient x1="102.04782%" y1="56.9424939%" x2="19.4834391%" y2="48.0080387%" id="linearGradient-1">
+            <stop stop-color="#00C4FF" offset="0%"></stop>
+            <stop stop-color="#0091FF" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="161.459445%" y1="70.748361%" x2="8.14034479%" y2="55.8960313%" id="linearGradient-2">
+            <stop stop-color="#00C4FF" offset="0%"></stop>
+            <stop stop-color="#0091FF" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="0%" y1="53.0199687%" x2="97.1198342%" y2="56.1376398%" id="linearGradient-3">
+            <stop stop-color="#0091FF" offset="0%"></stop>
+            <stop stop-color="#4C8CCF" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Cyber-Narrator" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="编组-5" transform="translate(2.000000, 10.000000)">
+            <g id="眼睛(1)" fill="url(#linearGradient-1)" fill-rule="nonzero">
+                <path d="M21.0230998,3.83625773e-07 C22.9018946,-0.000358154962 24.7692368,0.250604364 26.5576703,0.743822531 C28.3474071,1.23616739 29.9418273,1.88710409 31.296695,2.67855189 C32.6526943,3.47034188 33.942989,4.35521655 35.1318642,5.30856435 C36.3322894,6.27118069 37.3471836,7.23989998 38.1483213,8.18782925 C39.0264141,9.22550649 39.7188428,10.0855985 40.265117,10.8173284 C40.8995965,11.6664978 41.3186552,12.2793336 41.583937,12.7458692 L41.583937,12.7458692 L42,13.5002428 L41.9975369,13.5048058 L41.7387124,13.9783284 C41.4937052,14.3901766 41.2357743,14.7962864 40.9652013,15.1962146 C40.5970021,15.7590288 40.1723848,16.3524721 39.667251,17.0102818 C39.2119782,17.6027554 38.5997996,18.3119556 37.8475909,19.1181475 C37.1152363,19.9045676 36.3376104,20.6592396 35.5176046,21.3793576 C34.7149025,22.0819985 33.7565262,22.7932805 32.6691039,23.4934403 C31.5527235,24.2128787 30.4163388,24.823376 29.2915373,25.3080209 C28.1406071,25.8042728 26.8687191,26.2025918 25.4031786,26.5256504 C23.9758493,26.8403815 22.5048501,27.0000004 21.0310882,27.0000004 L21.0310882,27.0000004 L21,27.0000004 C19.0947974,27.0000004 17.2246772,26.7497494 15.4415309,26.2561783 C13.6367492,25.7560479 12.043494,25.1070789 10.7059678,24.3273523 C9.29125365,23.502167 8.03684022,22.6477217 6.87109813,21.7151639 C5.66634596,20.7522624 4.65022017,19.7886194 3.85097969,18.8509854 C3.00650485,17.8603067 2.31304425,17.0040647 1.73095541,16.2333785 C1.13938033,15.4507429 0.69549099,14.800947 0.411602857,14.3020143 L0.411602857,14.3020143 L0,13.5602744 L0.261320879,13.0789663 C0.366135462,12.8847547 0.619135094,12.4844678 1.03479871,11.8552338 C1.44378161,11.236227 1.87678411,10.6290985 2.33308186,10.0348639 C2.78535904,9.44641144 3.39763741,8.73316163 4.1529749,7.91496342 C4.88162262,7.122087 5.65950775,6.36335724 6.48326079,5.64206068 C7.28889198,4.93967642 8.24726826,4.22619845 9.33172826,3.52141866 C10.4405529,2.8014955 11.5768377,2.18905887 12.7090618,1.70107736 C13.8730397,1.19917878 15.1813417,0.787370398 16.5976869,0.477059667 C18.0359369,0.16070529 19.5148789,0.000430503856 20.999767,3.83625773e-07 L20.999767,3.83625773e-07 Z M21,2 C14.372583,2 9,7.372583 9,14 C9,20.627417 14.372583,26 21,26 C27.627417,26 33,20.627417 33,14 C33,7.372583 27.627417,2 21,2 Z" id="形状结合"></path>
+            </g>
+            <g id="编组-4" transform="translate(13.000000, 7.000000)" fill="url(#linearGradient-2)">
+                <path d="M1.69573643,8.04225352 L1.69573643,10.915493 L0.474806202,10.915493 L0.474806202,8.04225352 L1.69573643,8.04225352 Z M3.61434109,9.22535211 L3.61434109,10.915493 L2.39341085,10.915493 L2.39341085,9.22535211 L3.61434109,9.22535211 Z M5.53294574,6.35211268 L5.53294574,10.915493 L4.3120155,10.915493 L4.3120155,6.35211268 L5.53294574,6.35211268 Z M7.8003876,8.38028169 L7.8003876,10.915493 L6.57945736,10.915493 L6.57945736,8.38028169 L7.8003876,8.38028169 Z M10.0678295,5.33802817 L10.0678295,10.915493 L8.84689922,10.915493 L8.84689922,5.33802817 L10.0678295,5.33802817 Z M12.3352713,2.12676056 L12.3352713,10.915493 L11.1143411,10.915493 L11.1143411,2.12676056 L12.3352713,2.12676056 Z M14.9515504,0.774647887 L14.9515504,10.915493 L13.7306202,10.915493 L13.7306202,0.774647887 L14.9515504,0.774647887 Z" id="形状结合"></path>
+            </g>
+            <path d="M13,15.2685812 C13.3935884,14.3665795 13.7710632,13.9155786 14.1324244,13.9155786 C14.6744661,13.9155786 15.3553514,15.5388801 16.026866,15.2685812 C16.6983805,14.9982822 16.5324475,12.492122 17.5396648,12.2858641 C18.5468821,12.0796062 19.2461805,14.5177152 20.4467516,13.9155786 C20.9219825,13.6772304 21.3038921,11.9603124 22.5685587,10.3456709 C23.3015095,9.40988851 24.6327728,8.26734662 26.5623484,6.91804528" id="直线-2" stroke="#0E97FF" stroke-width="0.2" stroke-linecap="square"></path>
+            <path d="" id="三角形" stroke="#0091FF" fill="#0091FF" transform="translate(26.924045, 6.688984) rotate(58.000000) translate(-26.924045, -6.688984) "></path>
+            <circle id="椭圆形" stroke="url(#linearGradient-3)" stroke-width="0.4" cx="21" cy="14" r="10.8"></circle>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/img/logo1-2.png b/src/assets/img/logo1-2.png
deleted file mode 100644
index aeddd5f1..00000000
Binary files a/src/assets/img/logo1-2.png and /dev/null differ
diff --git a/src/components/charts/panel.scss b/src/components/charts/panel.scss
index 21bb8e7f..0ec27c82 100644
--- a/src/components/charts/panel.scss
+++ b/src/components/charts/panel.scss
@@ -1,6 +1,6 @@
 .cn-panel {
   display: grid;
-  grid-template-columns: repeat(12, 1fr);
+  grid-template-columns: repeat(30, 1fr);
   grid-auto-flow: row;
   grid-auto-rows: #{$--chart-height-unit}px;
   grid-gap: 10px;
diff --git a/src/components/layout/LeftMenu.vue b/src/components/layout/LeftMenu.vue
index 875e01fe..7ed67c39 100644
--- a/src/components/layout/LeftMenu.vue
+++ b/src/components/layout/LeftMenu.vue
@@ -7,7 +7,7 @@
         text-color="#ffffff">
       <el-menu-item index="logo">
         <div id="home-to-overview" class="logo link">
-          <img alt="loading..." height="26" :src="logo?logo:require('../../assets/img/logo1-2.png')"/>
+          <img alt="loading..." height="32" :src="logo?logo:require('../../assets/img/cn-logo-medium.svg')"/>
           <span class="system-name">{{systemName && systemName !== 'undefined' ? systemName : 'dashboard.overview.contentTitle'}}</span>
         </div>
       </el-menu-item>
@@ -26,7 +26,7 @@
             :index="`${index}`">
           <template #title>
             <i :class="menu.icon"></i>
-            <span>{{menu.name}}</span>
+            <span>{{menu.i18n ? $t(menu.i18n) : menu.name}}</span>
           </template>
           <template v-for="(secondMenu, secondIndex) in menu.children">
             <template v-if="secondMenu.children && secondMenu.children.length > 0">
@@ -34,13 +34,13 @@
                   :key="secondIndex"
                   :index="`${index}-${secondIndex}`">
                 <template #title>
-                  <span class="data-column__span">{{secondMenu.name}}</span>
+                  <span class="data-column__span">{{secondMenu.i18n ? $t(secondMenu.i18n) : secondMenu.name}}</span>
                 </template>
                 <el-menu-item
                     v-for="(thirdMenu, thirdIndex) in secondMenu.children"
                     :key="`${index}-${secondIndex}-${thirdIndex}`"
                     :index="thirdMenu.route">
-                  {{thirdMenu.name}}
+                  {{thirdMenu.i18n ? $t(thirdMenu.i18n) : thirdMenu.name}}
                 </el-menu-item>
               </el-submenu>
             </template>
@@ -48,7 +48,7 @@
               <el-menu-item
                   :key="secondIndex"
                   :index="secondMenu.route">
-                {{secondMenu.name}}
+                {{secondMenu.i18n ? $t(secondMenu.i18n) : secondMenu.name}}
               </el-menu-item>
             </template>
           </template>
@@ -59,7 +59,7 @@
             :index="menu.route">
           <i :class="menu.icon"></i>
           <template #title>
-            <span class="data-column__span">{{menu.name}}</span>
+            <span class="data-column__span">{{menu.i18n ? $t(menu.i18n) : menu.name}}</span>
           </template>
         </el-menu-item>
       </template>
@@ -216,12 +216,12 @@ export default {
         }
 
         .system-name {
-          padding-left: 5px;
+          padding-left: 8px;
           color: white;
-          font-size: 12px;
+          font-size: 14px;
           letter-spacing: 0;
           line-height: 34px;
-          font-weight: 400;
+          font-weight: bold;
         }
       }
     }