diff --git a/packages/ui/certd-client/public/static/images/logo/logo.svg b/packages/ui/certd-client/public/static/images/logo/logo.svg
index 3e53dac48..95ecba2b6 100644
--- a/packages/ui/certd-client/public/static/images/logo/logo.svg
+++ b/packages/ui/certd-client/public/static/images/logo/logo.svg
@@ -1,7 +1,7 @@
 <svg  version="1.0" xmlns="http://www.w3.org/2000/svg"
       width="500" height="500" viewBox="0 0 500.000000 500.000000"
 >
-    <path d="M28.34 56.68h28.34V36.12H28.34a7.79 7.79 0 1 1 0-15.58h19.84v9.05h8.5V12H28.34a16.29 16.29 0 0 0 0 32.58h19.84v3.56H28.34a19.84 19.84 0 0 1 0-39.68h28.34V0H28.34a28.34 28.34 0 0 0 0 56.68z"
+    <path fill="#333" d="M28.34 56.68h28.34V36.12H28.34a7.79 7.79 0 1 1 0-15.58h19.84v9.05h8.5V12H28.34a16.29 16.29 0 0 0 0 32.58h19.84v3.56H28.34a19.84 19.84 0 0 1 0-39.68h28.34V0H28.34a28.34 28.34 0 0 0 0 56.68z"
           transform="translate(70, 76) scale(6,6)"
     ></path>
 </svg>
\ No newline at end of file
diff --git a/packages/ui/certd-client/src/layout/layout-outside.vue b/packages/ui/certd-client/src/layout/layout-outside.vue
index 8b342c0a3..7c8152184 100644
--- a/packages/ui/certd-client/src/layout/layout-outside.vue
+++ b/packages/ui/certd-client/src/layout/layout-outside.vue
@@ -1,6 +1,6 @@
 <template>
   <div id="userLayout" :class="['user-layout-wrapper']">
-    <div class="login-container flex justify-start">
+    <div class="login-container flex justify-start dark:background-[#141414]">
       <div class="user-layout-content flex-col justify-start">
         <div class="top flex flex-col items-center justify-start">
           <div class="header flex flex-row items-center">
@@ -59,6 +59,14 @@ const sysPublic: Ref<SysPublicSetting> = computed(() => {
 </script>
 
 <style lang="less">
+.dark {
+  .login-container {
+    background: #141414 !important;
+    .desc {
+      color: rgba(227, 227, 227, 0.45) !important;
+    }
+  }
+}
 #userLayout.user-layout-wrapper {
   height: 100%;
 
diff --git a/packages/ui/certd-client/src/style/scroll.less b/packages/ui/certd-client/src/style/scroll.less
index 2e0303baf..ce50e1b15 100644
--- a/packages/ui/certd-client/src/style/scroll.less
+++ b/packages/ui/certd-client/src/style/scroll.less
@@ -18,8 +18,8 @@
   -webkit-border-radius: 4em;
   -moz-border-radius: 4em;
   border-radius: 4em;
-  background-color: #b3b3b3;
-  box-shadow: 0px 1px 1px #eee inset;
+  background-color: #757575;
+  
 }
 
 ::-webkit-scrollbar-thumb:hover {
diff --git a/packages/ui/certd-client/src/views/framework/home/dashboard/statistic-card.vue b/packages/ui/certd-client/src/views/framework/home/dashboard/statistic-card.vue
index ed29403b2..192f67b6f 100644
--- a/packages/ui/certd-client/src/views/framework/home/dashboard/statistic-card.vue
+++ b/packages/ui/certd-client/src/views/framework/home/dashboard/statistic-card.vue
@@ -74,6 +74,13 @@ function goDetail(link: any) {
 }
 </script>
 <style lang="less">
+.dark {
+  .data-item {
+    .header {
+      color: rgba(242, 242, 242, 0.85) !important;
+    }
+  }
+}
 .statistic-card {
   margin-bottom: 10px;
   .icon-text {
diff --git a/packages/ui/certd-client/src/views/framework/login/index.vue b/packages/ui/certd-client/src/views/framework/login/index.vue
index 4b447d842..4f781818e 100644
--- a/packages/ui/certd-client/src/views/framework/login/index.vue
+++ b/packages/ui/certd-client/src/views/framework/login/index.vue
@@ -311,6 +311,7 @@ export default defineComponent({
     .input-right {
       width: 160px;
       margin-left: 10px;
+      background: #cfcfcf !important;
     }
 
     .forge-password {