diff --git a/prettify.css b/prettify.css
index e81515fa..f5db08dc 100644
--- a/prettify.css
+++ b/prettify.css
@@ -24,3 +24,16 @@
   .atn { color: #404; }
   .atv { color: #060; }
 }
+
+@media screen and ( prefers-color-scheme: dark ) {
+  .str { color: #090; }
+  .kwd { color: #009; }
+  .com { color: #f77; }
+  .typ { color: #b0b; }
+  .lit { color: #0bb; }
+  .pun { color: #bb0; }
+  .pln { color: #fff; }
+  .tag { color: #77f; font-weight: bold; }
+  .atn { color: #f7f; }
+  .atv { color: #7f7; }
+}
diff --git a/xmpp.css b/xmpp.css
index 798a1eeb..522641a3 100644
--- a/xmpp.css
+++ b/xmpp.css
@@ -1677,6 +1677,48 @@
     }
 }
 
+@media screen and ( prefers-color-scheme: dark ) {
+    body {
+        background-color: #161616;
+        color: #ccc;
+    }
+
+    h1, h2, h3, h4, h5, h6 {
+        color: #eee;
+    }
+
+    table {
+        color: #eee;
+    }
+
+    tbody td {
+        border-top: 1px solid #333;
+    }
+
+    tbody tr:hover th,
+    tbody tr:hover td {
+        background-color: #282828;
+    }
+
+    figure.code,
+    figure.code-example,
+    figure.example {
+        background-color: #282828;
+    }
+
+    nav#toc ol.toc li {
+        background-color: rgba(255, 255, 255, 0.05);
+    }
+
+    nav#toc ol.toc li a:before {
+        color: #ccc;
+    }
+
+    a.standardsButton {
+        color: #eee;
+    }
+}
+
 @media print {
     a.anchor-link {
         display: none;