diff --git a/.DS_Store b/.DS_Store
index 6dfa38a8eea56d0378b4e816c009593080ee2177..3d88c7caa09e59e5036b9228408801d86d6056f9 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/src/.DS_Store b/src/.DS_Store
index 4316b3bb28a631ccfaf3f7def2560514dc3eb4ac..2cc92dee4cdf0823b3273f01282332e15298544f 100644
Binary files a/src/.DS_Store and b/src/.DS_Store differ
diff --git a/src/App.module.css b/src/App.module.css
index d4311e02b4d54793a4b240c1fc3570b0f32101d5..30c654a543ff8647f0bdca340b675b7b81033232 100644
--- a/src/App.module.css
+++ b/src/App.module.css
@@ -1,4 +1,4 @@
 .page-container {
-    margin-top: 48px;
+    margin-top: var(--header-height);
     height: 100%;
 }
diff --git a/src/common/.DS_Store b/src/common/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..2f66e783d38a995667f299dd02cf0fd9cd4cd128
Binary files /dev/null and b/src/common/.DS_Store differ
diff --git a/src/common/components/header/Header.module.css b/src/common/components/header/Header.module.css
index af8d1815c9f7330bfe1ae7faeaebc53dfa81e936..f0365d23830f30e2a010e95e43710e9c46d26594 100644
--- a/src/common/components/header/Header.module.css
+++ b/src/common/components/header/Header.module.css
@@ -1,5 +1,5 @@
 .container {
-    height: 48px;
+    height: var(--header-height);
     width: 100%;
     padding: 15px;
 
diff --git a/src/contexts/cart/index.tsx b/src/contexts/cart/index.tsx
index 89509994fe294a642ebead416f3832cd230ea0fd..dff5cc71ee32c5fdacaf681eba199592c1f14a00 100644
--- a/src/contexts/cart/index.tsx
+++ b/src/contexts/cart/index.tsx
@@ -5,7 +5,7 @@ import type {FC, ReactNode} from "react";
 
 interface CartContextType {
 	cartItem: CartItemData | null
-	setCartItem: (d: CartItemData | null) => any;
+	setCartItem: (d: CartItemData | null) => void;
 }
 
 const CartContext = createContext<CartContextType>({
diff --git a/src/index.css b/src/index.css
index 7e55cfdbb79b5dd94188321a343915e8614f0a44..d80802946c9038ef5b0b41b65b29618e5349c253 100644
--- a/src/index.css
+++ b/src/index.css
@@ -30,4 +30,6 @@ a {
   --fs-3: 12px;
   --fs-4: 16px;
   --fs-5: 20px;
+
+  --header-height: 48px;
 }
diff --git a/src/pages/.DS_Store b/src/pages/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..5bdd41fd2f7b949548db70047f450e52eff14616
Binary files /dev/null and b/src/pages/.DS_Store differ
diff --git a/src/pages/login-page/LoginPage.module.css b/src/pages/login-page/LoginPage.module.css
index 7e0a45db84a588a3ea4b5244064cfae96aaa8ee5..e607ceb8a34c7ddc0132ef7d5d5b35812ea57c27 100644
--- a/src/pages/login-page/LoginPage.module.css
+++ b/src/pages/login-page/LoginPage.module.css
@@ -1,7 +1,7 @@
 .container {
     width: 100vw;
     height: 100vh;
-    margin-top: -48px;
+    margin-top: calc(-1*var(--header-height));
 
     display: flex;
     flex-direction: column;
diff --git a/src/pages/signup-page/SignupPage.module.css b/src/pages/signup-page/SignupPage.module.css
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..478bc465522363755ba146e8fec43697dacbae72 100644
--- a/src/pages/signup-page/SignupPage.module.css
+++ b/src/pages/signup-page/SignupPage.module.css
@@ -0,0 +1,11 @@
+.container {
+    width: 100vw;
+    height: 100vh;
+    margin-top: calc(-1*var(--header-height));
+
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    gap: 8px;
+}
diff --git a/src/pages/signup-page/SignupPage.tsx b/src/pages/signup-page/SignupPage.tsx
index 174259c12fffe499b07ad46f1074166930c15717..e6ad9f3f98bee9510033ac68a2c509fb030d2629 100644
--- a/src/pages/signup-page/SignupPage.tsx
+++ b/src/pages/signup-page/SignupPage.tsx
@@ -1,7 +1,13 @@
 import S from './SignupPage.module.css';
 
 const SignupPage = () => {
-    return (<div>SignupPage</div>);
+    return (
+        <div className={S['container']}>
+            <input />
+            <input />
+            <input />
+        </div>
+    );
 };
 
 export default SignupPage;