diff --git a/themes/geekboot/assets/scss/_mermaid.scss b/themes/geekboot/assets/scss/_mermaid.scss
new file mode 100644
index 000000000..f19143a88
--- /dev/null
+++ b/themes/geekboot/assets/scss/_mermaid.scss
@@ -0,0 +1,14 @@
+.mermaid{
+    fill: var(--body-font-color) !important;
+
+    .messageText, .loopText>tspan, .marker, .marker.cross{
+        color: var(--body-font-color) !important;
+        fill: var(--body-font-color) !important;
+    }
+
+    .flowchart-link{
+        stroke: var(--body-font-color) !important;
+    }
+
+
+}
\ No newline at end of file
diff --git a/themes/geekboot/assets/scss/docs.scss b/themes/geekboot/assets/scss/docs.scss
index 904df3092..15c3b8d9b 100644
--- a/themes/geekboot/assets/scss/docs.scss
+++ b/themes/geekboot/assets/scss/docs.scss
@@ -49,4 +49,5 @@
 @import "crds";
 /* purgecss end ignore */
 @import "skippy";
-@import "fonts";
\ No newline at end of file
+@import "fonts";
+@import "mermaid";
\ No newline at end of file