Add better colors

assets/js/theme.js

@@ -8,7 +8,7 @@ var metaThemeColor = document.querySelector("meta[name=theme-color]");
 if (theme !== null) {
   document.body.classList.toggle("dark-theme", isDark);
   isDark
-    ? metaThemeColor.setAttribute("content", "#252627")
+    ? metaThemeColor.setAttribute("content", "#1b1c1d")
     : metaThemeColor.setAttribute("content", "#fafafa");
 }
 
@@ -22,6 +22,6 @@ themeToggle.addEventListener("click", () => {
     );
 
   document.body.classList.contains("dark-theme")
-    ? metaThemeColor.setAttribute("content", "#252627")
+    ? metaThemeColor.setAttribute("content", "#1b1c1d")
     : metaThemeColor.setAttribute("content", "#fafafa");
 });

assets/scss/_header.scss

@@ -7,7 +7,7 @@
   padding: 20px;
 
   .dark-theme & {
-    background: #252627;
+    background: #1b1c1d;
   }
 
   &__right {

assets/scss/_menu.scss

@@ -5,7 +5,7 @@
   z-index: 9999;
 
   .dark-theme & {
-    background: #252627;
+    background: #1b1c1d;
   }
 
   @media #{$media-size-phone} {

assets/scss/_variables.scss

@@ -8,9 +8,9 @@ $light-color-secondary: #999;
 $light-border-color: #dcdcdc;
 
 /* dark theme colors */
-$dark-background: #292a2d;
+$dark-background: #232425;
 $dark-background-secondary: #3b3d42;
-$dark-color: #a9a9b3;
+$dark-color: #b3b3bd;
 $dark-color-secondary: #73747b;
 $dark-border-color: #4a4b50;
 

exampleSite/config.toml

@@ -93,7 +93,7 @@ disableHugoGeneratorInject = false
   # Default theme "light" or "dark"
   #
   defaultTheme = "dark"
-  themeColor = "#252627"
+  themeColor = "#1b1c1d"
 
   # Custom footer 
   # If you want, you can easily override the default footer with your own content. 
@@ -104,9 +104,9 @@ disableHugoGeneratorInject = false
   # Colors for favicons
   #
   [params.favicon.color]
-    mask = "#252627"
-    msapplication = "#252627"
-    theme = "#252627"
+    mask = "#1b1c1d"
+    msapplication = "#1b1c1d"
+    theme = "#1b1c1d"
 
   [params.logo]
     logoMark     = ">"