diff --git a/public/img/icon/close.svg b/public/img/icon/close.svg
new file mode 100644
index 0000000..b82ce16
--- /dev/null
+++ b/public/img/icon/close.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 5L19 19" stroke="black" stroke-opacity="0.95" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5 19L19 5" stroke="black" stroke-opacity="0.95" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 0480202..0c4ffb4 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,5 +1,4 @@
-import Footer from '@/components/Footer';
-import Header from '@/components/Header';
+import { Header, Footer } from '@/components';
 
 import type { Metadata, Viewport } from 'next';
 
diff --git a/src/components/Header/index.tsx b/src/components/Header.tsx
similarity index 92%
rename from src/components/Header/index.tsx
rename to src/components/Header.tsx
index 97e5223..74ef219 100644
--- a/src/components/Header/index.tsx
+++ b/src/components/Header.tsx
@@ -3,7 +3,7 @@
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 
-import Logo from '@/components/Logo';
+import { Logo, LoginCard } from '@/components';
 
 export default function Header() {
   const pathName = usePathname();
@@ -42,6 +42,9 @@ export default function Header() {
 
           <button className="w-[74px] h-[36px] border-[#000] border-[1.5px] rounded-[60px] text-[17px]">登录</button>
         </div>
+
+        {/* 登录框 */}
+        {/* <LoginCard /> */}
       </div>
     </header>
   );
diff --git a/src/components/common/Input.tsx b/src/components/common/Input.tsx
new file mode 100644
index 0000000..754fa85
--- /dev/null
+++ b/src/components/common/Input.tsx
@@ -0,0 +1,13 @@
+const Input = ({ type, value, onChange, placeholder, className = '' }) => {
+  return (
+    <input
+      className={`w-full h-[56px] py-[18px] pl-[39px] rounded-[100px] px-[14px] bg-[#F2F3F7] leading-[20px] ${className}`}
+      type={type}
+      value={value}
+      onChange={onChange}
+      placeholder={placeholder}
+    />
+  );
+};
+
+export default Input;
diff --git a/src/components/index.ts b/src/components/index.ts
new file mode 100644
index 0000000..b219b9d
--- /dev/null
+++ b/src/components/index.ts
@@ -0,0 +1,9 @@
+export { default as Logo } from './Logo';
+export { default as Header } from './Header';
+export { default as Footer } from './Footer';
+
+export { default as LoginCard } from './LoginCard';
+export { default as LoginForm } from './LoginForm';
+
+// Common
+export { default as Input } from './common/Input';