preferable color scheme

public/index.html

@@ -11,12 +11,32 @@
     <title>yude.moe</title>
     <style>
         body {
-            background-color: black;
-            color: white;
             text-align: center;
             font-family: 'Roboto Mono', monospace;
         }
 
+        @media (prefers-color-scheme: dark) {
+            body {
+                background-color: black;
+                color: white;
+            }
+
+            a {
+                color: white
+            }
+        }
+
+        @media (prefers-color-scheme: light) {
+            body {
+                background-color: white;
+                color: black
+            }
+
+            a {
+                color: black
+            }
+        }
+
         .flex {
             padding: 2.5% 0;
             display: flex;
@@ -30,9 +50,7 @@
             text-align: center;
         }
 
-        a {
-            color: white
-        }
+
 
         .load {
             -webkit-animation: spin 4s linear infinite;