diff --git a/js/leibovitz/index.html b/js/leibovitz/index.html
index 986485c..7a5ca55 100644
--- a/js/leibovitz/index.html
+++ b/js/leibovitz/index.html
@@ -218,6 +218,19 @@
             padding: 10px;
             box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1);
             flex-shrink: 0;
+            position: relative;
+        }
+        #offline-status {
+            position: absolute;
+            top: 10px;
+            right: 10px;
+            font-size: 12px;
+            color: #666;
+            display: none;
+            font-family: 'ChicagoFLF', sans-serif;
+        }
+        #offline-status.visible {
+            display: block;
         }
         .top-controls {
             display: flex;
@@ -423,6 +436,7 @@
 </div>
 
 <div id="settings-container">
+    <div id="offline-status">Offline Mode</div>
     <div class="top-controls">
         <select id="dither-select">
             <option value="none">No Dithering</option>
@@ -451,5 +465,20 @@
 <script src="blur.js"></script>
 <script src="balance.js"></script>
 <script src="leibovitz.js"></script>
+<script>
+// Add offline status handling
+window.addEventListener('online', () => {
+    document.getElementById('offline-status').classList.remove('visible');
+});
+
+window.addEventListener('offline', () => {
+    document.getElementById('offline-status').classList.add('visible');
+});
+
+// Check initial online status
+if (!navigator.onLine) {
+    document.getElementById('offline-status').classList.add('visible');
+}
+</script>
 </body>
 </html>