diff --git a/h5/login.html b/h5/login.html
new file mode 100644
index 0000000..c96e7c1
--- /dev/null
+++ b/h5/login.html
@@ -0,0 +1,154 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <title>登录 - 郑州智慧工地</title>
+  <link rel="stylesheet" href="css/style.css">
+  <style>
+    .login-page {
+      min-height: 100vh;
+      background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      padding: 20px;
+    }
+
+    .login-card {
+      background-color: var(--color-card);
+      border-radius: 16px;
+      padding: 32px 24px;
+      width: 100%;
+      max-width: 360px;
+      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
+    }
+
+    .login-header {
+      text-align: center;
+      margin-bottom: 32px;
+    }
+
+    .login-logo {
+      font-size: 64px;
+      line-height: 1;
+      margin-bottom: 12px;
+    }
+
+    .login-title {
+      font-size: 22px;
+      font-weight: 700;
+      color: var(--color-text);
+    }
+
+    .login-form {
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+    }
+
+    .form-group {
+      display: flex;
+      flex-direction: column;
+      gap: 6px;
+    }
+
+    .form-label {
+      font-size: 14px;
+      font-weight: 500;
+      color: var(--color-text);
+    }
+
+    .form-input {
+      width: 100%;
+      padding: 12px 14px;
+      font-size: 15px;
+      border: 1px solid var(--color-border);
+      border-radius: 8px;
+      outline: none;
+      transition: border-color 0.2s ease;
+      background-color: var(--color-bg);
+    }
+
+    .form-input:focus {
+      border-color: var(--color-primary);
+    }
+
+    .login-btn {
+      margin-top: 8px;
+      padding: 14px 20px;
+      font-size: 16px;
+      font-weight: 600;
+      color: #ffffff;
+      background-color: var(--color-primary);
+      border: none;
+      border-radius: 8px;
+      cursor: pointer;
+      transition: background-color 0.2s ease;
+    }
+
+    .login-btn:hover:not(:disabled) {
+      background-color: var(--color-primary-light);
+    }
+
+    .login-btn:disabled {
+      opacity: 0.7;
+      cursor: not-allowed;
+    }
+
+    .login-footer {
+      margin-top: 24px;
+      text-align: center;
+      font-size: 12px;
+      color: var(--color-text-secondary);
+    }
+  </style>
+</head>
+<body>
+  <div class="login-page">
+    <div class="login-card">
+      <div class="login-header">
+        <div class="login-logo">🏗️</div>
+        <h1 class="login-title">郑州智慧工地</h1>
+      </div>
+      <form class="login-form" onsubmit="return false;">
+        <div class="form-group">
+          <label class="form-label" for="username">账号</label>
+          <input type="text" id="username" class="form-input" value="admin" placeholder="请输入账号">
+        </div>
+        <div class="form-group">
+          <label class="form-label" for="password">密码</label>
+          <input type="password" id="password" class="form-input" value="123456" placeholder="请输入密码">
+        </div>
+        <button type="button" id="loginBtn" class="login-btn">登录</button>
+      </form>
+      <div class="login-footer">智慧工地管理系统 v1.0</div>
+    </div>
+  </div>
+
+  <script src="js/mock.js"></script>
+  <script src="js/api.js"></script>
+  <script src="js/app.js"></script>
+  <script>
+    if (isLoggedIn()) location.href = 'index.html';
+
+    document.getElementById('loginBtn').addEventListener('click', async () => {
+      const username = document.getElementById('username').value.trim();
+      const password = document.getElementById('password').value;
+      if (!username || !password) { showToast('请输入账号和密码'); return; }
+      const btn = document.getElementById('loginBtn');
+      btn.disabled = true; btn.textContent = '登录中...';
+      try {
+        const res = await apiLogin(username, password);
+        if (res.code === 0) {
+          setToken(res.data.token);
+          showToast('登录成功');
+          setTimeout(() => location.href = 'index.html', 500);
+        } else { showToast(res.message || '登录失败'); }
+      } finally {
+        btn.disabled = false; btn.textContent = '登录';
+      }
+    });
+  </script>
+</body>
+</html>
