diff --git a/packages/docsify-dark-mode/README.md b/packages/docsify-dark-mode/README.md
index ca6e27e..c8203e1 100644
--- a/packages/docsify-dark-mode/README.md
+++ b/packages/docsify-dark-mode/README.md
@@ -52,12 +52,14 @@ window.$docsify = {
     dark: {
       background: "",
       toggleBtnBg: "",
-      textColor: ""
+      textColor: "",
+      codeColor: ""
     },
     light: {
       background: "",
       toggleBtnBg: "",
-      textColor: ""
+      textColor: "",
+      codeColor: ""
     }
   }
   // ...
@@ -71,12 +73,14 @@ window.$docsify = {
   dark: {
     background: "#1c2022",
     toggleBtnBg: "#34495e",
-    textColor: "#b4b4b4"
+    textColor: "#b4b4b4",
+    codeColor: "#3f484d"
   },
   light: {
     background: "white",
     toggleBtnBg: "var(--theme-color)",
-    textColor: "var(--theme-color)"
+    textColor: "var(--theme-color)",
+    codeColor: "white"
   }
 };
 ```
diff --git a/packages/docsify-dark-mode/src/index.js b/packages/docsify-dark-mode/src/index.js
index 1502951..967f5a3 100644
--- a/packages/docsify-dark-mode/src/index.js
+++ b/packages/docsify-dark-mode/src/index.js
@@ -1,78 +1,58 @@
-const plugin = (hook, vm) => {
-  var trans = () => {
-    document.documentElement.classList.add('transition')
-    window.setTimeout(() => {
-      document.documentElement.classList.remove('transition')
-    }, 800)
-  }
-  var setColor = ({ background, toggleBtnBg, textColor }) => {
-    document.documentElement.style.setProperty(
-      '--docsify_dark_mode_bg',
-      background
-    )
-    document.documentElement.style.setProperty(
-      '--docsify_dark_mode_btn',
-      toggleBtnBg
-    )
-    document.documentElement.style.setProperty('--text_color', textColor)
-  }
-
-  var theme = { dark: {}, light: {} }
-  var defaultConfig = {
+"use strict";
+window.$docsify.plugins = [].concat((t, e) => {
+  var o,
+    n = () => {
+      document.documentElement.classList.add("transition"),
+        window.setTimeout(() => {
+          document.documentElement.classList.remove("transition");
+        }, 800);
+    },
+    c = ({ background: t, toggleBtnBg: e, textColor: o, codeColor: f }) => {
+      document.documentElement.style.setProperty("--docsify_dark_mode_bg", t),
+        document.documentElement.style.setProperty(
+          "--docsify_dark_mode_btn",
+          e
+        ),
+        document.documentElement.style.setProperty("--text_color", o);
+        document.documentElement.style.setProperty("--code_color", f)
+    };
+  (o = {
     dark: {
-      background: '#1c2022',
-      toggleBtnBg: '#34495e',
-      textColor: '#b4b4b4'
+      background: "#1c2022",
+      toggleBtnBg: "#34495e",
+      textColor: "#b4b4b4",
+      codeColor: "#3f484d"
     },
     light: {
-      background: 'white',
-      toggleBtnBg: 'var(--theme-color)',
-      textColor: 'var(--theme-color)'
-    }
-  }
-
-  theme = { ...defaultConfig, ...vm.config.darkMode }
-
-  hook.afterEach(function(html, next) {
-    var darkEl = ` <div id="dark_mode">
-             <input class="container_toggle" type="checkbox" id="switch" name="mode" />
-             <label for="switch">Toggle</label>
-           </div>`
-    html = `${darkEl}${html}`
-    next(html)
-  })
-
-  hook.doneEach(function() {
-    var currColor
-    if (localStorage.getItem('DOCSIFY_DARK_MODE')) {
-      currColor = localStorage.getItem('DOCSIFY_DARK_MODE')
-      setColor(theme[`${currColor}`])
-    } else {
-      currColor = 'light'
-      setColor(theme.light)
-    }
-
-    var checkbox = document.querySelector('input[name=mode]')
-    
-    if (!checkbox) {
-      return
-    }
-
-    checkbox.addEventListener('change', function() {
-      // dark
-      if (currColor === 'light') {
-        trans()
-        setColor(theme.dark)
-        localStorage.setItem('DOCSIFY_DARK_MODE', 'dark')
-        currColor = 'dark'
-      } else {
-        trans()
-        setColor(theme.light)
-        localStorage.setItem('DOCSIFY_DARK_MODE', 'light')
-        currColor = 'light'
-      }
-    })
-  })
-}
-
-window.$docsify.plugins = [].concat(plugin, window.$docsify.plugins)
+      background: "white",
+      toggleBtnBg: "var(--theme-color)",
+      textColor: "var(--theme-color)",
+      codeColor: "white"
+    },
+    ...e.config.darkMode,
+  }),
+    t.afterEach(function (t, e) {
+      e(
+        (t = ` <div id="dark_mode">\n             <input class="container_toggle" type="checkbox" id="switch" name="mode" />\n             <label for="switch">Toggle</label>\n           </div>${t}`)
+      );
+    }),
+    t.doneEach(function () {
+      var t;
+      localStorage.getItem("DOCSIFY_DARK_MODE")
+        ? ((t = localStorage.getItem("DOCSIFY_DARK_MODE")), c(o[`${t}`]))
+        : ((t = "light"), c(o.light)),
+        document
+          .querySelector("input[name=mode]")
+          .addEventListener("change", function () {
+            "light" === t
+              ? (n(),
+                c(o.dark),
+                localStorage.setItem("DOCSIFY_DARK_MODE", "dark"),
+                (t = "dark"))
+              : (n(),
+                c(o.light),
+                localStorage.setItem("DOCSIFY_DARK_MODE", "light"),
+                (t = "light"));
+          });
+    });
+}, window.$docsify.plugins);
diff --git a/packages/docsify-dark-mode/src/style.css b/packages/docsify-dark-mode/src/style.css
index 490bd33..fa5968a 100644
--- a/packages/docsify-dark-mode/src/style.css
+++ b/packages/docsify-dark-mode/src/style.css
@@ -11,7 +11,18 @@ main,
 aside {
   background: var(--docsify_dark_mode_bg);
 }
-
+.sidebar ul li a {
+  color: var(--text_color)
+}
+.markdown-section code, .markdown-section pre {
+    background-color: var(--code_color);
+}
+.markdown-section td {
+    background-color: var(--docsify_dark_mode_bg);
+}
+.anchor span{
+    color: var(--text_color)
+}
 #dark_mode > input[type='checkbox'] {
   height: 0;
   width: 0;
@@ -37,42 +48,3 @@ aside {
   content: '';
   background: #fff;
   width: 20px;
-  height: 20px;
-  -webkit-border-radius: 50%;
-  -moz-border-radius: 50%;
-  border-radius: 50%;
-  position: absolute;
-  top: 5px;
-  left: 4px;
-  transition: cubic-bezier(0.68, -0.55, 0.27, 1.55) 320ms;
-}
-
-#dark_mode > input:checked + label {
-  background: var(--docsify_dark_mode_btn);
-}
-
-#dark_mode > input:checked + label:after {
-  left: calc(100% - 5px);
-  -webkit-transform: translateX(-100%);
-  -moz-transform: translateX(-100%);
-  -ms-transform: translateX(-100%);
-  -o-transform: translateX(-100%);
-  transform: translateX(-100%);
-}
-
-html.transition,
-html.transition *,
-html.transition *:before,
-html.transition *:after {
-  transition: cubic-bezier(0.68, -0.55, 0.27, 1.55) 420ms !important;
-  transition-delay: 0 !important;
-}
-
-#dark_mode {
-  position: absolute;
-  right: 0;
-  top: 0;
-}
-p {
-  color: var(--text_color);
-}