diff --git a/src/main/java/run/halo/plugin/textdiagram/BasicConfig.java b/src/main/java/run/halo/plugin/textdiagram/BasicConfig.java
index 8a4a196..a335c49 100644
--- a/src/main/java/run/halo/plugin/textdiagram/BasicConfig.java
+++ b/src/main/java/run/halo/plugin/textdiagram/BasicConfig.java
@@ -4,5 +4,6 @@
 
 @Data
 public class BasicConfig {
+    String dark_class_selector;
     String mermaid_selector;
 }
\ No newline at end of file
diff --git a/src/main/java/run/halo/plugin/textdiagram/DefaultPostContentHandler.java b/src/main/java/run/halo/plugin/textdiagram/DefaultPostContentHandler.java
index 089b418..ffba43b 100644
--- a/src/main/java/run/halo/plugin/textdiagram/DefaultPostContentHandler.java
+++ b/src/main/java/run/halo/plugin/textdiagram/DefaultPostContentHandler.java
@@ -15,15 +15,15 @@ public class DefaultPostContentHandler implements ReactivePostContentHandler {
 
     private final ReactiveSettingFetcher reactiveSettingFetcher;
 
-    private static void injectJS(PostContentContext contentContext, String mermaid_selector) {
-        String parsedScript = JSInjector.getParsedKatexScript(mermaid_selector);
+    private static void injectJS(PostContentContext contentContext, BasicConfig basicConfig) {
+        String parsedScript = JSInjector.getParsedKatexScript(basicConfig.getDark_class_selector(),basicConfig.getMermaid_selector());
         contentContext.setContent(parsedScript + "\n" + contentContext.getContent());
     }
 
     @Override
     public Mono<PostContentContext> handle(PostContentContext contentContext) {
         return reactiveSettingFetcher.fetch("basic", BasicConfig.class).map(basicConfig -> {
-            injectJS(contentContext, basicConfig.getMermaid_selector());
+            injectJS(contentContext, basicConfig);
             return contentContext;
         }).onErrorResume(e -> {
             log.error("TextDiagram PostContent handle failed", Throwables.getRootCause(e));
diff --git a/src/main/java/run/halo/plugin/textdiagram/JSInjector.java b/src/main/java/run/halo/plugin/textdiagram/JSInjector.java
index bdacbed..748a018 100644
--- a/src/main/java/run/halo/plugin/textdiagram/JSInjector.java
+++ b/src/main/java/run/halo/plugin/textdiagram/JSInjector.java
@@ -1,19 +1,23 @@
 package run.halo.plugin.textdiagram;
 
 public class JSInjector {
-    static String getParsedKatexScript(String mermaid_selector) {
+    static String getParsedKatexScript(String darkClassSelector, String mermaid_selector) {
         String katexScript = """
             <script defer src="/plugins/text-diagram/assets/static/mermaid.min.js"></script>
             <script>
                 document.addEventListener("DOMContentLoaded", function() {
                   const postBody = document.body
-                  mermaid.initialize({ startOnLoad: false });
+                  let darkModel = document.querySelector('%s')
+                  mermaid.initialize({
+                    startOnLoad: false,
+                    theme: darkModel?'dark':'default'
+                  });
                   mermaid.run({
                     querySelector: '%s',
                   });
                 });
             </script>
             """;
-        return String.format(katexScript, mermaid_selector);
+        return String.format(katexScript, darkClassSelector, mermaid_selector);
     }
 }
\ No newline at end of file
diff --git a/src/main/resources/extensions/settings.yaml b/src/main/resources/extensions/settings.yaml
index 3791531..3f82d24 100644
--- a/src/main/resources/extensions/settings.yaml
+++ b/src/main/resources/extensions/settings.yaml
@@ -7,6 +7,11 @@ spec:
     - group: basic
       label: 基本设置
       formSchema:
+        - $formkit: text
+          name: dark_class_selector
+          label: 暗黑模式的选择器
+          value: "html[class~=dark]"
+          help: 用于匹配暗黑模式的CSS选择器
         - $formkit: text
           name: mermaid_selector
           label: mermaid-CSS选择器