diff --git a/assets/scss/_code-dark.scss b/assets/scss/_code-dark.scss
new file mode 100644
index 0000000000..8058811720
--- /dev/null
+++ b/assets/scss/_code-dark.scss
@@ -0,0 +1,10 @@
+[data-bs-theme="light"] {
+  @import 'chroma/tango';
+}
+
+[data-bs-theme="dark"] {
+  @import 'chroma/onedark';
+  .chroma {
+    background-color: var(--td-pre-bg);
+  }
+}
diff --git a/assets/scss/_chroma-onedark.css b/assets/scss/chroma/_onedark.css
similarity index 100%
rename from assets/scss/_chroma-onedark.css
rename to assets/scss/chroma/_onedark.css
diff --git a/assets/scss/_chroma-tango.css b/assets/scss/chroma/_tango.css
similarity index 100%
rename from assets/scss/_chroma-tango.css
rename to assets/scss/chroma/_tango.css
diff --git a/userguide/assets/scss/_styles_project.scss b/userguide/assets/scss/_styles_project.scss
index 1ac9f65c62..8fc907c2ad 100644
--- a/userguide/assets/scss/_styles_project.scss
+++ b/userguide/assets/scss/_styles_project.scss
@@ -1,10 +1 @@
-[data-bs-theme="light"] {
-  @import 'chroma-tango';
-}
-
-[data-bs-theme="dark"] {
-  @import 'chroma-onedark';
-  .chroma {
-    background-color: var(--td-pre-bg);
-  }
-}
+@import 'code-dark';