diff --git a/index.html b/index.html
index 0fed973..8215fbc 100644
--- a/index.html
+++ b/index.html
@@ -14,6 +14,10 @@
     <script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script>
     <script src="https://cdn.datatables.net/1.10.22/js/dataTables.bootstrap4.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.0/moment.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/darkmode-js@1.5.7/lib/darkmode-js.min.js"></script>
+    <style>
+        .darkmode-layer, .darkmode-toggle { z-index: 500; }
+    </style>
 </head>
 
 <body class='mt-4 mb-2'>
diff --git a/js/main.js b/js/main.js
index 7c78297..41ce120 100644
--- a/js/main.js
+++ b/js/main.js
@@ -1,5 +1,6 @@
 window.addEventListener('load', () => {
   initDT(); // Initialize the DatatTable and window.columnNames variables
+  addDarkmodeWidget();
 
   const repo = getRepoFromUrl();
 
@@ -14,6 +15,10 @@ document.getElementById('form').addEventListener('submit', e => {
   fetchData();
 });
 
+function addDarkmodeWidget() {
+  new Darkmode( { label: '🌓' } ).showWidget();
+}
+
 function fetchData() {
   const repo = document.getElementById('q').value;
   const re = /[-_\w]+\/[-_.\w]+/;
