diff --git a/ui.css b/ui.css
index b393790..8f06ef9 100644
--- a/ui.css
+++ b/ui.css
@@ -1,7 +1,16 @@
 :root {
     --main-width: 85vw;
+    --text-color: #C71585;
+    --bg-color: white;
+
 }
-  
+
+@media (prefers-color-scheme: dark) {
+    :root {
+      --bg-color: #212121;
+    }
+}
+
 /* large screen */
 @media only screen and (min-width: 868px) {
     :root {
@@ -13,13 +22,14 @@
 html {
     font-family: Noto Sans;
     scroll-behavior: smooth;
-    color: #C71585;
+    color: var(--text-color);
 }
   
 body {
     max-width: var(--main-width);
     margin-left: auto;
     margin-right: auto;
+    background-color: var(--bg-color);
 }
 
 h1 {