diff --git a/data/opening_hours_how_to_edit.html b/data/opening_hours_how_to_edit.html
index e947ee3f1..e460b6770 100644
--- a/data/opening_hours_how_to_edit.html
+++ b/data/opening_hours_how_to_edit.html
@@ -2,12 +2,38 @@
 <html>
 
 <head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
   <style>
     /* All langs are invisible by default. */
     [lang] {
       display: none;
     }
+	
+    /* Dark mode support. */
+    :root {
+      color-scheme: light dark;
+      --primary-color: black;
+      --secondary-color: #555555;
+      --link-color: #37653F;
+      --background-color: white;
+      --separator-color: #0e0e0e;
+    }
 
+    @media screen and (prefers-color-scheme: dark) {
+      :root {
+        --primary-color: #b5b5b5;
+        --secondary-color: #858585;
+        --link-color: #659464;
+        --background-color: black;
+        --separator-color: #0a0a0a;
+      }
+    }
+
+    html { 
+        color: var(--secondary-color);
+        background-color: var(--background-color);
+	}
     .example {
     font-weight: bold;
     font-family: monospace;
