diff --git a/public/index.html b/public/index.html
index 2562f5e..0f61e6f 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,66 +1,106 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
+<!DOCTYPE html><html lang="zh-CN" data-theme="light">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>OpenList Token获取工具</title>
-    <link href="static/style-all.css" rel="stylesheet">
-    <link href="static/bootstrap.css" rel="stylesheet">
-    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>
+    <title>OpenList Token 获取工具</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
     <style>
+        :root {
+            --bg-color-light: #ffffff;
+            --text-color-light: #000000;
+            --bg-color-dark: #1e1e2f;
+            --text-color-dark: #f0f0f0;
+            --accent-color: #00d1b2;
+        }[data-theme="light"] body {
+        background-color: var(--bg-color-light);
+        color: var(--text-color-light);
+    }
+
+    [data-theme="dark"] body {
+        background-color: var(--bg-color-dark);
+        color: var(--text-color-dark);
+    }
+
+    .form-container {
+        max-width: 800px;
+        margin: 3rem auto;
+        padding: 2rem;
+        border-radius: 1rem;
+        box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
+        background: inherit;
+        backdrop-filter: blur(10px);
+    }
+
+    label {
+        font-weight: 600;
+    }
+
+    .form-control:read-only {
+        background-color: #f5f5f5;
+        cursor: pointer;
+    }
+
+    .toggle-theme {
+        position: fixed;
+        top: 1rem;
+        right: 1rem;
+    }
+    
+    a {
+        text-decoration: none;
+    }
+</style>
 
-    </style>
 </head>
 <body>
-<div class="container">
-    <div class="form-container" style="max-width: 1600px;">
-        <h1>OpenList Token获取工具</h1>
-
-        <div class="input-group">
-            <label for="site-select">网盘名称</label>
-            <select id="site-select">
-                <option value="official" selected>OneDrive 官方站点</option>
-                <!--                <option value="cn">OneDrive 世纪互联</option>-->
-            </select>
-        </div>
-
-        <div class="input-group">
-            <label for="client-id">客户端ID(Client ID)</label>
-            <input type="text" id="client-id" name="client-id">
-        </div>
-
-        <div class="input-group">
-            <label for="app-secret">应用机密(App Secret)</label>
-            <input type="text" id="app-secret" name="app-secret">
-        </div>
-
-        <div class="input-group">
-            <label for="callback-url">回调地址(Callback URL)</label>
-            <input type="text" id="callback-url" name="callback-url" value="https://api.oplist.org/onedrive/callback"
-                   readonly onclick="autoCopy(this)">
-        </div>
-
-        <div class="input-group">
-            <button class="btn btn-success" onclick="getLogin()">获取Token</button>
-        </div>
-
-        <div class="input-group">
-            <label for="access-token">访问秘钥(Access Token)</label>
-            <textarea type="text" id="access-token" name="access-token" readonly onclick="autoCopy(this)"></textarea>
-        </div>
-
-        <div class="input-group">
-            <label for="refresh-token">刷新秘钥(Refresh Token)</label>
-            <textarea type="text" id="refresh-token" name="refresh-token" readonly onclick="autoCopy(this)"></textarea>
-        </div>
-
-        <div class="input-group">
-            本获取工具不存储任何用户信息，开源于<a href="https://github.com/OpenListTeam/cf-worker-api">CF-Worker-API</a>
-        </div>
-    </div>
+<div class="toggle-theme">
+    <button class="btn btn-outline-secondary" onclick="toggleTheme()">切换主题</button>
+</div><div class="container form-container">
+    <h2 class="text-center mb-4">🔐 OpenList Token 获取工具</h2><div class="mb-3">
+    <label for="site-select" class="form-label">网盘名称</label>
+    <select id="site-select" class="form-select">
+        <option value="official" selected>OneDrive 官方站点</option>
+    </select>
 </div>
 
-</body>
+<div class="mb-3">
+    <label for="client-id" class="form-label">客户端 ID</label>
+    <input type="text" id="client-id" class="form-control">
+</div>
+
+<div class="mb-3">
+    <label for="app-secret" class="form-label">应用机密</label>
+    <input type="text" id="app-secret" class="form-control">
+</div>
+
+<div class="mb-3">
+    <label for="callback-url" class="form-label">回调地址</label>
+    <input type="text" id="callback-url" class="form-control" value="https://api.oplist.org/onedrive/callback" readonly onclick="autoCopy(this)">
+</div>
+
+<div class="d-grid gap-2 mb-3">
+    <button class="btn btn-primary" onclick="getLogin()">获取 Token</button>
+</div>
+
+<div class="mb-3">
+    <label for="access-token" class="form-label">访问秘钥</label>
+    <textarea id="access-token" class="form-control" rows="3" readonly onclick="autoCopy(this)"></textarea>
+</div>
+
+<div class="mb-3">
+    <label for="refresh-token" class="form-label">刷新秘钥</label>
+    <textarea id="refresh-token" class="form-control" rows="3" readonly onclick="autoCopy(this)"></textarea>
+</div>
+
+<div class="text-muted text-center">
+  <p style="text-align:center">
+    本工具不储存任何用户信息<br>
+    开源于 <a href=" " target="_blank">GitHub</a > | by <a href="https://github.com/OpenListTeam" target="_blank">OpenListTeam</a >
+  </p >
+</div>
+
+</div>
 <script>
     let intervalId;
 
@@ -144,5 +184,19 @@
     }
 
     getToken();
-</script>
-</html>
\ No newline at end of file
+
+    //手动切换主题模式
+    function toggleTheme() {
+        const html = document.documentElement;
+        const current = html.getAttribute("data-theme");
+        html.setAttribute("data-theme", current === "dark" ? "light" : "dark");
+    }
+    
+    // 自动切换暗黑模式
+    (function () {
+        const hour = new Date().getHours();
+        if (hour < 6 || hour >= 18) document.documentElement.setAttribute("data-theme", "dark");
+        getToken();
+    })();
+</script></body>
+</html>
