diff --git a/_static/style.css b/_static/style.css
index 0fded2f..81c7719 100644
--- a/_static/style.css
+++ b/_static/style.css
@@ -31,10 +31,10 @@ legend{border:0;padding:0}
 button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}
 button,input{line-height:normal}
 button,select{text-transform:none}
-button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
+button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;appearance:button;cursor:pointer}
 button[disabled],html input[disabled]{cursor:default}
 input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
-input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
+input[type="search"]{-webkit-appearance:textfield;appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
 input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
 button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
 textarea{overflow:auto;vertical-align:top}
@@ -44,6 +44,49 @@ table{border-collapse:collapse;border-spacing:0}
 /* Skyfield custom styles */
 /* Colors darkened and lightened with http://gka.github.io/chroma.js/ */
 
+/* CSS Variables for theming */
+:root {
+  /* Light theme colors */
+  --bg-color: #ffffff;
+  --text-color: #000000;
+  --heading-color: #002664;
+  --link-color: #0000ee;
+  --link-hover-color: #0000cc;
+  --code-bg: #FDF6E3;
+  --code-border: #e3dcca;
+  --code-hover-border: #827c6b;
+  --pre-border: #93A1A1;
+  --table-border: #eee;
+  --admonition-bg: #eee;
+  --admonition-warning-bg: #edd;
+  --admonition-border: white;
+  --motto-border: black;
+  --dt-color: #790000;
+  --viewcode-color: #888;
+  --copyright-opacity: 0.5;
+}
+
+/* Dark theme colors */
+.dark-mode {
+  --bg-color: #1a1a1a;
+  --text-color: #e0e0e0;
+  --heading-color: #4a9eff;
+  --link-color: #66b3ff;
+  --link-hover-color: #99ccff;
+  --code-bg: #2d2d2d;
+  --code-border: #555555;
+  --code-hover-border: #777777;
+  --pre-border: #666666;
+  --table-border: #444444;
+  --admonition-bg: #2a2a2a;
+  --admonition-warning-bg: #3d2a2a;
+  --admonition-border: #1a1a1a;
+  --motto-border: #e0e0e0;
+  --dt-color: #ff6b6b;
+  --viewcode-color: #aaaaaa;
+  --copyright-opacity: 0.7;
+}
+
 @font-face {
     font-family: 'Gentium Basic';
     font-style: normal;
@@ -59,6 +102,33 @@ table{border-collapse:collapse;border-spacing:0}
          url('gentium-basic-v11-latin-italic.woff') format('woff');
 }
 
+/* Theme toggle button */
+.theme-toggle {
+    position: fixed;
+    top: 20px;
+    right: 20px;
+    z-index: 1000;
+}
+
+#theme-toggle {
+    background: var(--code-bg);
+    border: 1px solid var(--code-border);
+    border-radius: 50%;
+    width: 40px;
+    height: 40px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 18px;
+    transition: all 0.3s ease;
+}
+
+#theme-toggle:hover {
+    border-color: var(--code-hover-border);
+    transform: scale(1.1);
+}
+
 body, body > img {
     display: block;
     margin-left: auto;
@@ -69,12 +139,14 @@ body {
     line-height: 1.4em;
     font-family: "Gentium Basic", sans-serif, serif;
     max-width: 36em;
+    background-color: var(--bg-color);
+    color: var(--text-color);
 }
 img {
     max-width: 100%;
 }
 h1, h2 {
-    color: #002664;
+    color: var(--heading-color);
 }
 #skyfield h1 {
     margin-bottom: 0;
@@ -98,12 +170,12 @@ h1, h2 {
     color: #ddd;
 }
 .admonition {
-    border: 1em solid white;
+    border: 1em solid var(--admonition-border);
     padding: 0em 2em;
-    background-color: #eee;
+    background-color: var(--admonition-bg);
 }
 .admonition-warning {
-    background-color: #edd;
+    background-color: var(--admonition-warning-bg);
 }
 .admonition-title {
     text-align: center;
@@ -115,17 +187,17 @@ h1, h2 {
 }
 .motto em {
     padding-bottom: 0.75em;
-    border-bottom: 1px solid black;
+    border-bottom: 1px solid var(--motto-border);
 }
 code, pre, tt, dt {
     font-family: "Ubuntu Mono Custom", monospace, serif;
 }
 code, pre, tt {
-    background-color: #FDF6E3;
+    background-color: var(--code-bg);
 }
 code, tt {
     border-radius: 3px;
-    border: 1px solid #e3dcca;
+    border: 1px solid var(--code-border);
     padding: 1px 2px 2px;
     font-size: 0.8em;
 }
@@ -135,7 +207,7 @@ code {
     line-height: 0px;
 }
 a code:hover, a tt:hover {
-    border-color: #827c6b;
+    border-color: var(--code-hover-border);
 }
 code.py-obj {
     border: none;
@@ -147,7 +219,7 @@ dt {
     display: inline-block;
     padding-left: 4em;
     text-indent: -4em;
-    color: #790000
+    color: var(--dt-color);
 }
 dt em {
     font-style: normal;
@@ -162,7 +234,7 @@ li {
     margin-bottom: 0.3em;
 }
 pre {
-    border: 1px dashed #93A1A1;
+    border: 1px dashed var(--pre-border);
     padding: 0.5em 0.8em;
     line-height: 1.25;
     font-size: 0.8em;
@@ -180,7 +252,7 @@ table[border="1"] {
 }
 td {
     border: none;
-    border-bottom: 1px solid #eee;
+    border-bottom: 1px solid var(--table-border);
     padding: 0.2em 0.5em 0.2em 0;
 }
 tr:last-child td {
@@ -189,11 +261,11 @@ tr:last-child td {
 .viewcode-link {
     float: right;
     margin-left: 1em;
-    color: #888;
+    color: var(--viewcode-color);
 }
 .copyright {
     text-align: center;
-    opacity: 0.5;
+    opacity: var(--copyright-opacity);
 }
 @media screen and (min-width: 480px) {body {font-size: 1.125em;}}
 @media screen and (min-width: 640px) {body {max-width: 42em;}}
@@ -271,3 +343,83 @@ tr:last-child td {
 .vg { color: #268bd2 } /* Name.Variable.Global */
 .vi { color: #268bd2 } /* Name.Variable.Instance */
 .il { color: #2aa198 } /* Literal.Number.Integer.Long */
+
+/* Dark mode syntax highlighting */
+.dark-mode .hll { background-color: #333333 }
+.dark-mode .c { color: #6c757d; font-style: italic } /* Comment */
+.dark-mode .err { color: #ff6b6b } /* Error */
+.dark-mode .g { color: #adb5bd } /* Generic */
+.dark-mode .k { color: #20c997 } /* Keyword */
+.dark-mode .l { color: #adb5bd } /* Literal */
+.dark-mode .n { color: #e9ecef } /* Name */
+.dark-mode .o { color: #adb5bd } /* Operator */
+.dark-mode .x { color: #adb5bd } /* Other */
+.dark-mode .p { color: #adb5bd } /* Punctuation */
+.dark-mode .cm { color: #6c757d; font-style: italic } /* Comment.Multiline */
+.dark-mode .cp { color: #6c757d; font-style: italic } /* Comment.Preproc */
+.dark-mode .c1 { color: #6c757d; font-style: italic } /* Comment.Single */
+.dark-mode .cs { color: #6c757d; font-style: italic } /* Comment.Special */
+.dark-mode .gd { color: #adb5bd } /* Generic.Deleted */
+.dark-mode .ge { color: #adb5bd } /* Generic.Emph */
+.dark-mode .gr { color: #adb5bd } /* Generic.Error */
+.dark-mode .gh { color: #adb5bd } /* Generic.Heading */
+.dark-mode .gi { color: #adb5bd } /* Generic.Inserted */
+.dark-mode .go { color: #ffffff } /* Generic.Output */
+.dark-mode .gp { color: #fd7e14 } /* Generic.Prompt */
+.dark-mode .gs { color: #adb5bd } /* Generic.Strong */
+.dark-mode .gu { color: #adb5bd } /* Generic.Subheading */
+.dark-mode .gt { color: #adb5bd } /* Generic.Traceback */
+.dark-mode .kc { color: #20c997 } /* Keyword.Constant */
+.dark-mode .kd { color: #20c997 } /* Keyword.Declaration */
+.dark-mode .kn { color: #fd7e14 } /* Keyword.Namespace */
+.dark-mode .kp { color: #fd7e14 } /* Keyword.Pseudo */
+.dark-mode .kr { color: #20c997 } /* Keyword.Reserved */
+.dark-mode .kt { color: #20c997 } /* Keyword.Type */
+.dark-mode .ld { color: #adb5bd } /* Literal.Date */
+.dark-mode .m { color: #20c997 } /* Literal.Number */
+.dark-mode .s { color: #20c997 } /* Literal.String */
+.dark-mode .na { color: #adb5bd } /* Name.Attribute */
+.dark-mode .nb { color: #0dcaf0 } /* Name.Builtin */
+.dark-mode .nc { color: #0dcaf0 } /* Name.Class */
+.dark-mode .no { color: #ffc107 } /* Name.Constant */
+.dark-mode .nd { color: #fd7e14 } /* Name.Decorator */
+.dark-mode .ni { color: #fd7e14 } /* Name.Entity */
+.dark-mode .ne { color: #fd7e14 } /* Name.Exception */
+.dark-mode .nf { color: #0dcaf0 } /* Name.Function */
+.dark-mode .nl { color: #adb5bd } /* Name.Label */
+.dark-mode .nn { color: #ffc107 } /* Name.Namespace */
+.dark-mode .nx { color: #adb5bd } /* Name.Other */
+.dark-mode .py { color: #0dcaf0 } /* Name.Property */
+.dark-mode .nt { color: #20c997 } /* Name.Tag */
+.dark-mode .nv { color: #fd7e14 } /* Name.Variable */
+.dark-mode .ow { color: #20c997 } /* Operator.Word */
+.dark-mode .w { color: #1a1a1a } /* Text.Whitespace */
+.dark-mode .mf { color: #20c997 } /* Literal.Number.Float */
+.dark-mode .mh { color: #20c997 } /* Literal.Number.Hex */
+.dark-mode .mi { color: #20c997 } /* Literal.Number.Integer */
+.dark-mode .mo { color: #20c997 } /* Literal.Number.Oct */
+.dark-mode .sb { color: #20c997 } /* Literal.String.Backtick */
+.dark-mode .sc { color: #20c997 } /* Literal.String.Char */
+.dark-mode .sd { color: #20c997 } /* Literal.String.Doc */
+.dark-mode .s2 { color: #20c997 } /* Literal.String.Double */
+.dark-mode .se { color: #fd7e14 } /* Literal.String.Escape */
+.dark-mode .sh { color: #20c997 } /* Literal.String.Heredoc */
+.dark-mode .si { color: #fd7e14 } /* Literal.String.Interpol */
+.dark-mode .sx { color: #20c997 } /* Literal.String.Other */
+.dark-mode .sr { color: #20c997 } /* Literal.String.Regex */
+.dark-mode .s1 { color: #20c997 } /* Literal.String.Single */
+.dark-mode .ss { color: #20c997 } /* Literal.String.Symbol */
+.dark-mode .bp { color: #0dcaf0; font-weight: bold } /* Name.Builtin.Pseudo */
+.dark-mode .vc { color: #0dcaf0 } /* Name.Variable.Class */
+.dark-mode .vg { color: #0dcaf0 } /* Name.Variable.Global */
+.dark-mode .vi { color: #0dcaf0 } /* Name.Variable.Instance */
+.dark-mode .il { color: #20c997 } /* Literal.Number.Integer.Long */
+
+/* Dark mode link colors */
+.dark-mode a {
+    color: var(--link-color);
+}
+
+.dark-mode a:hover {
+    color: var(--link-hover-color);
+}
diff --git a/_templates/layout.html b/_templates/layout.html
index b5822af..3cb4af3 100644
--- a/_templates/layout.html
+++ b/_templates/layout.html
@@ -6,8 +6,25 @@
     <title>{{ title|striptags|e }}</title>
     <link rel="stylesheet" type="text/css"
           href="{{ pathto('_static/style.css', true) }}">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     {% if title != 'Python Design Patterns' %}
     <p class="motto">
       •
@@ -20,7 +37,36 @@
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
diff --git a/docs/.nojekyll b/docs/.nojekyll
deleted file mode 100644
index e69de29..0000000
diff --git a/docs/CNAME b/docs/CNAME
deleted file mode 100644
index c943938..0000000
--- a/docs/CNAME
+++ /dev/null
@@ -1 +0,0 @@
-python-patterns.guide
\ No newline at end of file
diff --git a/docs/_static/style.css b/docs/_static/style.css
index 0fded2f..81c7719 100644
--- a/docs/_static/style.css
+++ b/docs/_static/style.css
@@ -31,10 +31,10 @@ legend{border:0;padding:0}
 button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}
 button,input{line-height:normal}
 button,select{text-transform:none}
-button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
+button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;appearance:button;cursor:pointer}
 button[disabled],html input[disabled]{cursor:default}
 input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
-input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
+input[type="search"]{-webkit-appearance:textfield;appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
 input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
 button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
 textarea{overflow:auto;vertical-align:top}
@@ -44,6 +44,49 @@ table{border-collapse:collapse;border-spacing:0}
 /* Skyfield custom styles */
 /* Colors darkened and lightened with http://gka.github.io/chroma.js/ */
 
+/* CSS Variables for theming */
+:root {
+  /* Light theme colors */
+  --bg-color: #ffffff;
+  --text-color: #000000;
+  --heading-color: #002664;
+  --link-color: #0000ee;
+  --link-hover-color: #0000cc;
+  --code-bg: #FDF6E3;
+  --code-border: #e3dcca;
+  --code-hover-border: #827c6b;
+  --pre-border: #93A1A1;
+  --table-border: #eee;
+  --admonition-bg: #eee;
+  --admonition-warning-bg: #edd;
+  --admonition-border: white;
+  --motto-border: black;
+  --dt-color: #790000;
+  --viewcode-color: #888;
+  --copyright-opacity: 0.5;
+}
+
+/* Dark theme colors */
+.dark-mode {
+  --bg-color: #1a1a1a;
+  --text-color: #e0e0e0;
+  --heading-color: #4a9eff;
+  --link-color: #66b3ff;
+  --link-hover-color: #99ccff;
+  --code-bg: #2d2d2d;
+  --code-border: #555555;
+  --code-hover-border: #777777;
+  --pre-border: #666666;
+  --table-border: #444444;
+  --admonition-bg: #2a2a2a;
+  --admonition-warning-bg: #3d2a2a;
+  --admonition-border: #1a1a1a;
+  --motto-border: #e0e0e0;
+  --dt-color: #ff6b6b;
+  --viewcode-color: #aaaaaa;
+  --copyright-opacity: 0.7;
+}
+
 @font-face {
     font-family: 'Gentium Basic';
     font-style: normal;
@@ -59,6 +102,33 @@ table{border-collapse:collapse;border-spacing:0}
          url('gentium-basic-v11-latin-italic.woff') format('woff');
 }
 
+/* Theme toggle button */
+.theme-toggle {
+    position: fixed;
+    top: 20px;
+    right: 20px;
+    z-index: 1000;
+}
+
+#theme-toggle {
+    background: var(--code-bg);
+    border: 1px solid var(--code-border);
+    border-radius: 50%;
+    width: 40px;
+    height: 40px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 18px;
+    transition: all 0.3s ease;
+}
+
+#theme-toggle:hover {
+    border-color: var(--code-hover-border);
+    transform: scale(1.1);
+}
+
 body, body > img {
     display: block;
     margin-left: auto;
@@ -69,12 +139,14 @@ body {
     line-height: 1.4em;
     font-family: "Gentium Basic", sans-serif, serif;
     max-width: 36em;
+    background-color: var(--bg-color);
+    color: var(--text-color);
 }
 img {
     max-width: 100%;
 }
 h1, h2 {
-    color: #002664;
+    color: var(--heading-color);
 }
 #skyfield h1 {
     margin-bottom: 0;
@@ -98,12 +170,12 @@ h1, h2 {
     color: #ddd;
 }
 .admonition {
-    border: 1em solid white;
+    border: 1em solid var(--admonition-border);
     padding: 0em 2em;
-    background-color: #eee;
+    background-color: var(--admonition-bg);
 }
 .admonition-warning {
-    background-color: #edd;
+    background-color: var(--admonition-warning-bg);
 }
 .admonition-title {
     text-align: center;
@@ -115,17 +187,17 @@ h1, h2 {
 }
 .motto em {
     padding-bottom: 0.75em;
-    border-bottom: 1px solid black;
+    border-bottom: 1px solid var(--motto-border);
 }
 code, pre, tt, dt {
     font-family: "Ubuntu Mono Custom", monospace, serif;
 }
 code, pre, tt {
-    background-color: #FDF6E3;
+    background-color: var(--code-bg);
 }
 code, tt {
     border-radius: 3px;
-    border: 1px solid #e3dcca;
+    border: 1px solid var(--code-border);
     padding: 1px 2px 2px;
     font-size: 0.8em;
 }
@@ -135,7 +207,7 @@ code {
     line-height: 0px;
 }
 a code:hover, a tt:hover {
-    border-color: #827c6b;
+    border-color: var(--code-hover-border);
 }
 code.py-obj {
     border: none;
@@ -147,7 +219,7 @@ dt {
     display: inline-block;
     padding-left: 4em;
     text-indent: -4em;
-    color: #790000
+    color: var(--dt-color);
 }
 dt em {
     font-style: normal;
@@ -162,7 +234,7 @@ li {
     margin-bottom: 0.3em;
 }
 pre {
-    border: 1px dashed #93A1A1;
+    border: 1px dashed var(--pre-border);
     padding: 0.5em 0.8em;
     line-height: 1.25;
     font-size: 0.8em;
@@ -180,7 +252,7 @@ table[border="1"] {
 }
 td {
     border: none;
-    border-bottom: 1px solid #eee;
+    border-bottom: 1px solid var(--table-border);
     padding: 0.2em 0.5em 0.2em 0;
 }
 tr:last-child td {
@@ -189,11 +261,11 @@ tr:last-child td {
 .viewcode-link {
     float: right;
     margin-left: 1em;
-    color: #888;
+    color: var(--viewcode-color);
 }
 .copyright {
     text-align: center;
-    opacity: 0.5;
+    opacity: var(--copyright-opacity);
 }
 @media screen and (min-width: 480px) {body {font-size: 1.125em;}}
 @media screen and (min-width: 640px) {body {max-width: 42em;}}
@@ -271,3 +343,83 @@ tr:last-child td {
 .vg { color: #268bd2 } /* Name.Variable.Global */
 .vi { color: #268bd2 } /* Name.Variable.Instance */
 .il { color: #2aa198 } /* Literal.Number.Integer.Long */
+
+/* Dark mode syntax highlighting */
+.dark-mode .hll { background-color: #333333 }
+.dark-mode .c { color: #6c757d; font-style: italic } /* Comment */
+.dark-mode .err { color: #ff6b6b } /* Error */
+.dark-mode .g { color: #adb5bd } /* Generic */
+.dark-mode .k { color: #20c997 } /* Keyword */
+.dark-mode .l { color: #adb5bd } /* Literal */
+.dark-mode .n { color: #e9ecef } /* Name */
+.dark-mode .o { color: #adb5bd } /* Operator */
+.dark-mode .x { color: #adb5bd } /* Other */
+.dark-mode .p { color: #adb5bd } /* Punctuation */
+.dark-mode .cm { color: #6c757d; font-style: italic } /* Comment.Multiline */
+.dark-mode .cp { color: #6c757d; font-style: italic } /* Comment.Preproc */
+.dark-mode .c1 { color: #6c757d; font-style: italic } /* Comment.Single */
+.dark-mode .cs { color: #6c757d; font-style: italic } /* Comment.Special */
+.dark-mode .gd { color: #adb5bd } /* Generic.Deleted */
+.dark-mode .ge { color: #adb5bd } /* Generic.Emph */
+.dark-mode .gr { color: #adb5bd } /* Generic.Error */
+.dark-mode .gh { color: #adb5bd } /* Generic.Heading */
+.dark-mode .gi { color: #adb5bd } /* Generic.Inserted */
+.dark-mode .go { color: #ffffff } /* Generic.Output */
+.dark-mode .gp { color: #fd7e14 } /* Generic.Prompt */
+.dark-mode .gs { color: #adb5bd } /* Generic.Strong */
+.dark-mode .gu { color: #adb5bd } /* Generic.Subheading */
+.dark-mode .gt { color: #adb5bd } /* Generic.Traceback */
+.dark-mode .kc { color: #20c997 } /* Keyword.Constant */
+.dark-mode .kd { color: #20c997 } /* Keyword.Declaration */
+.dark-mode .kn { color: #fd7e14 } /* Keyword.Namespace */
+.dark-mode .kp { color: #fd7e14 } /* Keyword.Pseudo */
+.dark-mode .kr { color: #20c997 } /* Keyword.Reserved */
+.dark-mode .kt { color: #20c997 } /* Keyword.Type */
+.dark-mode .ld { color: #adb5bd } /* Literal.Date */
+.dark-mode .m { color: #20c997 } /* Literal.Number */
+.dark-mode .s { color: #20c997 } /* Literal.String */
+.dark-mode .na { color: #adb5bd } /* Name.Attribute */
+.dark-mode .nb { color: #0dcaf0 } /* Name.Builtin */
+.dark-mode .nc { color: #0dcaf0 } /* Name.Class */
+.dark-mode .no { color: #ffc107 } /* Name.Constant */
+.dark-mode .nd { color: #fd7e14 } /* Name.Decorator */
+.dark-mode .ni { color: #fd7e14 } /* Name.Entity */
+.dark-mode .ne { color: #fd7e14 } /* Name.Exception */
+.dark-mode .nf { color: #0dcaf0 } /* Name.Function */
+.dark-mode .nl { color: #adb5bd } /* Name.Label */
+.dark-mode .nn { color: #ffc107 } /* Name.Namespace */
+.dark-mode .nx { color: #adb5bd } /* Name.Other */
+.dark-mode .py { color: #0dcaf0 } /* Name.Property */
+.dark-mode .nt { color: #20c997 } /* Name.Tag */
+.dark-mode .nv { color: #fd7e14 } /* Name.Variable */
+.dark-mode .ow { color: #20c997 } /* Operator.Word */
+.dark-mode .w { color: #1a1a1a } /* Text.Whitespace */
+.dark-mode .mf { color: #20c997 } /* Literal.Number.Float */
+.dark-mode .mh { color: #20c997 } /* Literal.Number.Hex */
+.dark-mode .mi { color: #20c997 } /* Literal.Number.Integer */
+.dark-mode .mo { color: #20c997 } /* Literal.Number.Oct */
+.dark-mode .sb { color: #20c997 } /* Literal.String.Backtick */
+.dark-mode .sc { color: #20c997 } /* Literal.String.Char */
+.dark-mode .sd { color: #20c997 } /* Literal.String.Doc */
+.dark-mode .s2 { color: #20c997 } /* Literal.String.Double */
+.dark-mode .se { color: #fd7e14 } /* Literal.String.Escape */
+.dark-mode .sh { color: #20c997 } /* Literal.String.Heredoc */
+.dark-mode .si { color: #fd7e14 } /* Literal.String.Interpol */
+.dark-mode .sx { color: #20c997 } /* Literal.String.Other */
+.dark-mode .sr { color: #20c997 } /* Literal.String.Regex */
+.dark-mode .s1 { color: #20c997 } /* Literal.String.Single */
+.dark-mode .ss { color: #20c997 } /* Literal.String.Symbol */
+.dark-mode .bp { color: #0dcaf0; font-weight: bold } /* Name.Builtin.Pseudo */
+.dark-mode .vc { color: #0dcaf0 } /* Name.Variable.Class */
+.dark-mode .vg { color: #0dcaf0 } /* Name.Variable.Global */
+.dark-mode .vi { color: #0dcaf0 } /* Name.Variable.Instance */
+.dark-mode .il { color: #20c997 } /* Literal.Number.Integer.Long */
+
+/* Dark mode link colors */
+.dark-mode a {
+    color: var(--link-color);
+}
+
+.dark-mode a:hover {
+    color: var(--link-hover-color);
+}
diff --git a/docs/fowler-refactoring/index.html b/docs/fowler-refactoring/index.html
index 73496a1..cd116f8 100644
--- a/docs/fowler-refactoring/index.html
+++ b/docs/fowler-refactoring/index.html
@@ -6,8 +6,25 @@
     <title>Refactoring by Martin Fowler</title>
     <link rel="stylesheet" type="text/css"
           href="../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -46,7 +63,36 @@ <h1><em>Refactoring</em> by Martin Fowler<a class="headerlink" href="#refactorin
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/abstract-factory/index.html b/docs/gang-of-four/abstract-factory/index.html
index 40e6cce..76baf7a 100644
--- a/docs/gang-of-four/abstract-factory/index.html
+++ b/docs/gang-of-four/abstract-factory/index.html
@@ -6,8 +6,25 @@
     <title>The Abstract Factory Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -314,7 +331,36 @@ <h2>Generalizing: the complete Abstract Factory<a class="headerlink" href="#gene
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/builder/index.html b/docs/gang-of-four/builder/index.html
index 7bd4671..200b5db 100644
--- a/docs/gang-of-four/builder/index.html
+++ b/docs/gang-of-four/builder/index.html
@@ -6,8 +6,25 @@
     <title>The Builder Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -234,7 +251,7 @@ <h2>Dueling builders<a class="headerlink" href="#dueling-builders" title="Link t
 (the example has been lightly edited to translate it into Python):</p>
 <div class="highlight-python notranslate"><div class="highlight"><pre><span></span><span class="k">class</span><span class="w"> </span><span class="nc">StandardMazeBuilder</span><span class="p">(</span><span class="nb">object</span><span class="p">):</span>
     <span class="c1"># ...</span>
-    <span class="k">def</span><span class="w"> </span><span class="nf">build_door</span><span class="p">(</span><span class="n">n1</span><span class="p">,</span> <span class="n">n2</span><span class="p">):</span>
+    <span class="k">def</span><span class="w"> </span><span class="nf">build_door</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">n1</span><span class="p">,</span> <span class="n">n2</span><span class="p">):</span>
         <span class="n">room1</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">_current_maze</span><span class="o">.</span><span class="n">get_room</span><span class="p">(</span><span class="n">n1</span><span class="p">)</span>
         <span class="n">room2</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">_current_maze</span><span class="o">.</span><span class="n">get_room</span><span class="p">(</span><span class="n">n2</span><span class="p">)</span>
         <span class="n">door</span> <span class="o">=</span> <span class="n">Door</span><span class="p">(</span><span class="n">r1</span><span class="p">,</span> <span class="n">r2</span><span class="p">)</span>
@@ -429,7 +446,36 @@ <h2>A degenerate case: simulating optional arguments<a class="headerlink" href="
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/composite/index.html b/docs/gang-of-four/composite/index.html
index 100906d..c86c21d 100644
--- a/docs/gang-of-four/composite/index.html
+++ b/docs/gang-of-four/composite/index.html
@@ -6,8 +6,25 @@
     <title>The Composite Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -471,7 +488,36 @@ <h2>Implementation: to inherit, or not?<a class="headerlink" href="#implementati
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/composition-over-inheritance/index.html b/docs/gang-of-four/composition-over-inheritance/index.html
index 42be3e8..68c440e 100644
--- a/docs/gang-of-four/composition-over-inheritance/index.html
+++ b/docs/gang-of-four/composition-over-inheritance/index.html
@@ -6,8 +6,25 @@
     <title>The Composition Over Inheritance Principle</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -1113,7 +1130,36 @@ <h2>Dodge: Building classes dynamically<a class="headerlink" href="#dodge-buildi
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/decorator-pattern/index.html b/docs/gang-of-four/decorator-pattern/index.html
index 67f7625..27cb0e7 100644
--- a/docs/gang-of-four/decorator-pattern/index.html
+++ b/docs/gang-of-four/decorator-pattern/index.html
@@ -6,8 +6,25 @@
     <title>The Decorator Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -683,7 +700,36 @@ <h2>Further Reading<a class="headerlink" href="#further-reading" title="Link to
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/factory-method/index.html b/docs/gang-of-four/factory-method/index.html
index 93a0c5d..150f411 100644
--- a/docs/gang-of-four/factory-method/index.html
+++ b/docs/gang-of-four/factory-method/index.html
@@ -6,8 +6,25 @@
     <title>The Factory Method Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -366,7 +383,36 @@ <h2>Implementing<a class="headerlink" href="#implementing" title="Link to this h
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/flyweight/index.html b/docs/gang-of-four/flyweight/index.html
index 92c3491..288a610 100644
--- a/docs/gang-of-four/flyweight/index.html
+++ b/docs/gang-of-four/flyweight/index.html
@@ -6,8 +6,25 @@
     <title>The Flyweight Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -284,7 +301,36 @@ <h2>Implementing<a class="headerlink" href="#implementing" title="Link to this h
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/index.html b/docs/gang-of-four/index.html
index 822525c..b9959cd 100644
--- a/docs/gang-of-four/index.html
+++ b/docs/gang-of-four/index.html
@@ -6,8 +6,25 @@
     <title>Gang of Four book</title>
     <link rel="stylesheet" type="text/css"
           href="../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -60,7 +77,36 @@ <h1>Gang of Four book<a class="headerlink" href="#gang-of-four-book" title="Link
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/iterator/index.html b/docs/gang-of-four/iterator/index.html
index df5b95e..54209c7 100644
--- a/docs/gang-of-four/iterator/index.html
+++ b/docs/gang-of-four/iterator/index.html
@@ -6,8 +6,25 @@
     <title>The Iterator Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -619,7 +636,36 @@ <h2>Python’s extra level of indirection<a class="headerlink" href="#pythons-ex
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/prototype/index.html b/docs/gang-of-four/prototype/index.html
index f1c60e7..ba5c616 100644
--- a/docs/gang-of-four/prototype/index.html
+++ b/docs/gang-of-four/prototype/index.html
@@ -6,8 +6,25 @@
     <title>The Prototype Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -252,7 +269,36 @@ <h2>Implementing<a class="headerlink" href="#implementing" title="Link to this h
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/gang-of-four/singleton/index.html b/docs/gang-of-four/singleton/index.html
index fb8a2fd..f2caf58 100644
--- a/docs/gang-of-four/singleton/index.html
+++ b/docs/gang-of-four/singleton/index.html
@@ -6,8 +6,25 @@
     <title>The Singleton Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -367,7 +384,36 @@ <h2>Verdict<a class="headerlink" href="#verdict" title="Link to this heading">¶
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/index.html b/docs/index.html
index 2222e4d..824cc14 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -6,8 +6,25 @@
     <title>Python Design Patterns</title>
     <link rel="stylesheet" type="text/css"
           href="_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <article>
       <section id="python-design-patterns">
@@ -181,7 +198,36 @@ <h2>Bibliography<a class="headerlink" href="#bibliography" title="Link to this h
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/python/module-globals/index.html b/docs/python/module-globals/index.html
index 151b764..c43e60a 100644
--- a/docs/python/module-globals/index.html
+++ b/docs/python/module-globals/index.html
@@ -6,8 +6,25 @@
     <title>The Global Object Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -555,7 +572,36 @@ <h2>Import-time I/O<a class="headerlink" href="#import-time-i-o" title="Link to
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/python/prebound-methods/index.html b/docs/python/prebound-methods/index.html
index b4f5d0b..66993d8 100644
--- a/docs/python/prebound-methods/index.html
+++ b/docs/python/prebound-methods/index.html
@@ -6,8 +6,25 @@
     <title>The Prebound Method Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -290,7 +307,36 @@ <h2>The pattern<a class="headerlink" href="#the-pattern" title="Link to this hea
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/docs/python/sentinel-object/index.html b/docs/python/sentinel-object/index.html
index 5d8bdc4..4b354aa 100644
--- a/docs/python/sentinel-object/index.html
+++ b/docs/python/sentinel-object/index.html
@@ -6,8 +6,25 @@
     <title>The Sentinel Object Pattern</title>
     <link rel="stylesheet" type="text/css"
           href="../../_static/style.css">
+    <script>
+      // Dark mode initialization
+      (function() {
+        const savedTheme = localStorage.getItem('theme');
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        const shouldUseDark = savedTheme === 'dark' || (!savedTheme && prefersDark);
+        
+        if (shouldUseDark) {
+          document.documentElement.classList.add('dark-mode');
+        }
+      })();
+    </script>
   </head>
   <body>
+    <div class="theme-toggle">
+      <button id="theme-toggle" aria-label="Toggle dark mode">
+        <span class="theme-icon">🌙</span>
+      </button>
+    </div>
     
     <p class="motto">
       •
@@ -314,7 +331,36 @@ <h2>Sentinel Objects<a class="headerlink" href="#sentinel-objects" title="Link t
     </article>
     <hr>
     <p class="copyright">
-      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
+      © 2018–2020 <a href="http://rhodesmill.org/brandon/">Brandon Rhodes</a>
     </p>
+    <script>
+      // Dark mode toggle functionality
+      (function() {
+        const themeToggle = document.getElementById('theme-toggle');
+        const themeIcon = document.querySelector('.theme-icon');
+        
+        function updateThemeIcon() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          themeIcon.textContent = isDark ? '☀️' : '🌙';
+        }
+        
+        function toggleTheme() {
+          const isDark = document.documentElement.classList.contains('dark-mode');
+          
+          if (isDark) {
+            document.documentElement.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+          } else {
+            document.documentElement.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+          }
+          
+          updateThemeIcon();
+        }
+        
+        themeToggle.addEventListener('click', toggleTheme);
+        updateThemeIcon(); // Set initial icon
+      })();
+    </script>
   </body>
 </html>
\ No newline at end of file