diff --git a/css/themes.css b/css/themes.css
index f3d0c3a48..e656467aa 100644
--- a/css/themes.css
+++ b/css/themes.css
@@ -1,40 +1,42 @@
-:root {
-    --search-title-color: var(--quacs-yellow);
-    --search-term-color: var(--quacs-midtone);
-    --search-entry-text-color: var(--quacs-white);
-    --search-entry-bg-color: var(--mid-dark-purple);
-    --search-entry-bg-hover-color: var(--mid-dark-purple);
-    --search-entry-title-color: var(--quacs-midtone);
-    --pill-default-color: var(--quacs-yellow);
-    --pill-text-color: var(--deep-purple);
-    --pill-svg-color: var(--deep-purple);
-    --ci-pill-color: var(--green);
-    --wi-pill-color: var(--quacs-yellow);
-    --course-pill-color: var(--quacs-yellow);
-    --course-pill-hover-color: var(--quacs-midtone);
-    --pdii-pill-color: var(--red);
-    --hinq-pill-color: var(--pink);
-    --table-selection-color: var(--quacs-yellow);
-    --course-name-color: var(--quacs-yellow);
-    --course-code-color: var(--quacs-midtone);
-    --or-block-color: var(--blue);
-    --or-block-bg-color: var(--deep-purple);
-    --or-text-color: var(--quacs-white);
-    --and-block-color: var(--red);
-    --and-text-color: var(--quacs-white);
-    --none-block-color: var(--red);
-    --none-text-color: var(--quacs-white);
-    --unknown-block-color: var(--pink);
-    --unknown-text-color: var(--quacs-white);
-    --key-text-color: var(--quacs-midtone);
-    --yes-color: var(--green);
-    --no-color: var(--red);
-    --diff-code-color: var(--quacs-yellow);
-    --nil-color: var(--mid-light-purple);
-    --view-select-color: var(--quacs-midtone);
-    --term-text-color: var(--deep-purple);
-    --view-select-color-selected: var(--quacs-yellow);
-    --season-label-color: var(--quacs-midtone);
-    --year-label-color: var(--quacs-midtone);
-    --mid-summer-label-color: var(--quacs-white);
+@media (prefers-color-scheme: dark) {
+    :root {
+        --search-title-color: var(--quacs-yellow);
+        --search-term-color: var(--quacs-midtone);
+        --search-entry-text-color: var(--quacs-white);
+        --search-entry-bg-color: var(--mid-dark-purple);
+        --search-entry-bg-hover-color: var(--mid-dark-purple);
+        --search-entry-title-color: var(--quacs-midtone);
+        --pill-default-color: var(--quacs-yellow);
+        --pill-text-color: var(--deep-purple);
+        --pill-svg-color: var(--deep-purple);
+        --ci-pill-color: var(--green);
+        --wi-pill-color: var(--quacs-yellow);
+        --course-pill-color: var(--quacs-yellow);
+        --course-pill-hover-color: var(--quacs-midtone);
+        --pdii-pill-color: var(--red);
+        --hinq-pill-color: var(--pink);
+        --table-selection-color: var(--quacs-yellow);
+        --course-name-color: var(--quacs-yellow);
+        --course-code-color: var(--quacs-midtone);
+        --or-block-color: var(--blue);
+        --or-block-bg-color: var(--deep-purple);
+        --or-text-color: var(--quacs-white);
+        --and-block-color: var(--red);
+        --and-text-color: var(--quacs-white);
+        --none-block-color: var(--red);
+        --none-text-color: var(--quacs-white);
+        --unknown-block-color: var(--pink);
+        --unknown-text-color: var(--quacs-white);
+        --key-text-color: var(--quacs-midtone);
+        --yes-color: var(--green);
+        --no-color: var(--red);
+        --diff-code-color: var(--quacs-yellow);
+        --nil-color: var(--mid-light-purple);
+        --view-select-color: var(--quacs-midtone);
+        --term-text-color: var(--deep-purple);
+        --view-select-color-selected: var(--quacs-yellow);
+        --season-label-color: var(--quacs-midtone);
+        --year-label-color: var(--quacs-midtone);
+        --mid-summer-label-color: var(--quacs-white);
+    }
 }