diff --git a/src/pages/AuthPage/AuthPage.css b/src/pages/AuthPage/AuthPage.css
new file mode 100644
index 0000000..5073ce3
--- /dev/null
+++ b/src/pages/AuthPage/AuthPage.css
@@ -0,0 +1,96 @@
+.auth-container {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end; /* 使卡片靠右 */
+  min-height: 100vh;
+  font-family: Arial, sans-serif;
+  background-color: #5F4437; /* 设置背景颜色 */
+  padding: 0 2rem; /* 添加左右内边距 */
+}
+
+.auth-container img {
+  margin-left: 250px; 
+}
+
+.auth-form-section {
+  background: #E4D8C9; /* 米白色 */
+  padding: 2rem;
+  border-radius: 10px;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+  width: 300px;
+  margin: 0 auto;
+  max-width: 400px; /* 限制卡片最大宽度 */
+}
+
+.form-group {
+  margin-bottom: 1.2rem;
+  display: flex;
+  flex-direction: column;
+}
+
+label {
+  display: block;
+  font-size: 0.9rem;
+  margin-bottom: 0.5rem;
+  color: #4A3B34; /* 棕色 */
+}
+
+.form-input {
+  width: 100%;
+  padding: 0.8rem;
+  border: 1px solid #ddd;
+  border-radius: 5px;
+  font-size: 0.9rem;
+  box-sizing: border-box;
+}
+
+.auth-button {
+  padding: 0.8rem 8.4rem;
+  background: #BA929A; /* 粉色 */
+  color: #4A3B34; /* 棕色 */
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+  font-size: 0.9rem;
+  display: inline-block;
+}
+
+.verify-button {
+  padding: 0.5rem 1rem; /* 更小的内边距 */
+  background: #BA929A; /* 粉色 */
+  color: #4A3B34; /* 棕色 */
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+  font-size: 0.8rem; /* 更小的字体 */
+  display: inline-block;
+}
+
+.link-button {
+  background: none;
+  border: none;
+  color: #4A3B34; /* 棕色 */
+  /* text-decoration: underline; */
+  cursor: pointer;
+  font-size: 0.8rem;
+  padding: 0;
+}
+
+.forgot-password {
+  position: absolute;
+  right: 10px; /* 让按钮靠右 */
+  bottom: 5px; /* 调整到底部 */
+  font-size: 12px;
+  background: none;
+  border: none;
+  color: #4A3B34; /* 颜色与 "点击注册" 一致 */
+  cursor: pointer;
+  text-decoration: underline;
+}
+
+
+.register-link, .login-link {
+  text-align: center;
+  font-size: 0.8rem;
+  margin-top: 1rem;
+}
\ No newline at end of file
diff --git a/src/pages/AuthPage/AuthPage.jsx b/src/pages/AuthPage/AuthPage.jsx
new file mode 100644
index 0000000..4238214
--- /dev/null
+++ b/src/pages/AuthPage/AuthPage.jsx
@@ -0,0 +1,19 @@
+import React, { useState } from 'react';
+import Login from '../../components/Auth/Login';
+import Register from '../../components/Auth/Register';
+
+const AuthPage = () => {
+  const [isRegister, setIsRegister] = useState(false);
+
+  return (
+    <div>
+      {isRegister ? (
+        <Register onLoginClick={() => setIsRegister(false)} />
+      ) : (
+        <Login onRegisterClick={() => setIsRegister(true)} />
+      )}
+    </div>
+  );
+};
+
+export default AuthPage;
\ No newline at end of file
diff --git a/src/pages/AuthPage/AuthPage.test.jsx b/src/pages/AuthPage/AuthPage.test.jsx
new file mode 100644
index 0000000..e398536
--- /dev/null
+++ b/src/pages/AuthPage/AuthPage.test.jsx
@@ -0,0 +1,31 @@
+import React from 'react';
+import { render, screen, fireEvent } from '@testing-library/react';
+import AuthPage from './AuthPage';
+
+describe('AuthPage component', () => {
+  test('switches between login and register forms', () => {
+    render(<AuthPage />);
+
+    const registerButton = screen.getByText('点击注册');
+    fireEvent.click(registerButton);
+
+    const usernameInput = screen.getByPlaceholderText('请输入用户名');
+    const passwordInput = screen.getByPlaceholderText('请输入密码');
+    const emailInput = screen.getByPlaceholderText('请输入邮箱');
+
+    expect(usernameInput).toBeInTheDocument();
+    expect(passwordInput).toBeInTheDocument();
+    expect(emailInput).toBeInTheDocument();
+
+    const loginButton = screen.getByText('点击登录');
+    fireEvent.click(loginButton);
+
+    const loginUsernameInput = screen.getByPlaceholderText('请输入用户名');
+    const loginPasswordInput = screen.getByPlaceholderText('请输入密码');
+    const loginSubmitButton = screen.getByText('登录');
+
+    expect(loginUsernameInput).toBeInTheDocument();
+    expect(loginPasswordInput).toBeInTheDocument();
+    expect(loginSubmitButton).toBeInTheDocument();
+  });
+});
\ No newline at end of file