diff --git a/docs/assets/css/dark_mode.css b/docs/assets/css/dark_mode.css
new file mode 100644
index 000000000..108ef5263
--- /dev/null
+++ b/docs/assets/css/dark_mode.css
@@ -0,0 +1,45 @@
+[data-md-color-scheme="slate"] {
+    --md-primary-fg-color: #6a290d;
+    --md-primary-fg-color--light: #8d7474;
+    --md-primary-fg-color--dark: #6d554d;
+
+    .hljs-title,
+    .hljs-title.class_,
+    .hljs-title.class_.inherited__,
+    .hljs-title.function_ {
+        color: #c9a69b;
+    }
+
+    .hljs-meta .hljs-string,
+    .hljs-regexp,
+    .hljs-string {
+        color: #a3b4c7;
+    }
+
+    .hljs-attr,
+    .hljs-attribute,
+    .hljs-literal,
+    .hljs-meta,
+    .hljs-number,
+    .hljs-operator,
+    .hljs-selector-attr,
+    .hljs-selector-class,
+    .hljs-selector-id,
+    .hljs-variable {
+        color: #c1b79f;
+    }
+
+    .hljs-doctag,
+    .hljs-keyword,
+    .hljs-meta .hljs-keyword,
+    .hljs-template-tag,
+    .hljs-template-variable,
+    .hljs-type,
+    .hljs-variable.language_ {
+        color: #c97100;
+    }
+
+    .hljs-subst {
+        color: #ddba52
+    }
+}
diff --git a/docs/assets/hljs.js b/docs/assets/js/hljs.js
similarity index 100%
rename from docs/assets/hljs.js
rename to docs/assets/js/hljs.js
diff --git a/mkdocs.yml b/mkdocs.yml
index d0ff9a41e..98e3cc197 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -54,7 +54,7 @@ extra:
     - icon: material/slack
       link: https://join.slack.com/t/codeigniterchat/shared_invite/zt-244xrrslc-l_I69AJSi5y2a2RVN~xIdQ
       name: Slack
-      
+
 
 repo_url: https://github.com/codeigniter4/shield
 edit_uri: edit/develop/docs/
@@ -67,10 +67,11 @@ markdown_extensions:
 
 extra_css:
   - https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.6.0/build/styles/github.min.css
+  - assets/css/dark_mode.css
 
 extra_javascript:
   - https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.6.0/build/highlight.min.js
-  - assets/hljs.js
+  - assets/js/hljs.js
 
 nav:
   - Home: index.md