diff --git a/src/app/mypage/boards/page.tsx b/src/app/mypage/boards/page.tsx
new file mode 100644
index 0000000..cdbd221
--- /dev/null
+++ b/src/app/mypage/boards/page.tsx
@@ -0,0 +1,96 @@
+import Header from '@/components/Header'
+
+const Page = () => {
+  return (
+    <div className="min-h-dvh">
+      <Header
+        title="내 보드 목록"
+        description="총 4개"
+        leftButton={<Header.BackButton />}
+      />
+
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+    </div>
+  )
+}
+
+export default Page
diff --git a/src/app/mypage/leave/page.tsx b/src/app/mypage/leave/page.tsx
new file mode 100644
index 0000000..c00092d
--- /dev/null
+++ b/src/app/mypage/leave/page.tsx
@@ -0,0 +1,16 @@
+import Header from '@/components/Header'
+
+const Page = () => {
+  return (
+    <div className="min-h-dvh">
+      <Header title="탈퇴하기" leftButton={<Header.BackButton />} />
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+    </div>
+  )
+}
+
+export default Page
diff --git a/src/app/mypage/profileEdit/page.tsx b/src/app/mypage/profileEdit/page.tsx
new file mode 100644
index 0000000..1973579
--- /dev/null
+++ b/src/app/mypage/profileEdit/page.tsx
@@ -0,0 +1,16 @@
+import Header from '@/components/Header'
+
+const Page = () => {
+  return (
+    <div className="min-h-dvh">
+      <Header title="프로필 수정" leftButton={<Header.BackButton />} />
+      <div>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus amet
+        atque consectetur culpa, doloribus earum eius eos eum fuga fugiat harum
+        ipsam laborum omnis quae sint tenetur totam ut voluptates.
+      </div>
+    </div>
+  )
+}
+
+export default Page
diff --git a/src/components/Header/HeaderBackButton.tsx b/src/components/Header/HeaderBackButton.tsx
new file mode 100644
index 0000000..7495843
--- /dev/null
+++ b/src/components/Header/HeaderBackButton.tsx
@@ -0,0 +1,12 @@
+'use client'
+
+import BackIcon from 'public/icons/arrow_back_ios.svg'
+import { useRouter } from 'next/navigation'
+
+const HeaderBackButton = () => {
+  const router = useRouter()
+
+  return <BackIcon onClick={() => router.back()} />
+}
+
+export default HeaderBackButton
diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx
new file mode 100644
index 0000000..97c1bfd
--- /dev/null
+++ b/src/components/Header/index.tsx
@@ -0,0 +1,38 @@
+import { ReactNode } from 'react'
+import HeaderBackButton from '@/components/Header/HeaderBackButton'
+
+interface HeaderProps {
+  title?: string
+  description?: string
+  leftButton?: ReactNode
+  rightButton?: ReactNode
+}
+
+const Header = ({
+  title = '',
+  description = '',
+  leftButton = null,
+  rightButton = null,
+}: HeaderProps) => {
+  return (
+    <>
+      <header className="fixed grid h-16 w-full max-w-md grid-cols-3 justify-between bg-gray-0 p-5 shadow-header">
+        <div className="justify-self-start">{leftButton}</div>
+        <div className="justify-self-center">
+          <div className="text-center text-md font-semiBold leading-6">
+            {title}
+          </div>
+          <div className="mt-1 text-center text-xs font-regular leading-4 text-gray-700">
+            {description}
+          </div>
+        </div>
+        <div className="justify-self-end">{rightButton}</div>
+      </header>
+      <div className="block h-16 w-full" />
+    </>
+  )
+}
+
+Header.BackButton = HeaderBackButton
+
+export default Header
diff --git a/tailwind.config.ts b/tailwind.config.ts
index adcf1e3..5983fa8 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -62,6 +62,9 @@ const config: Config = {
       height: {
         dvh: 'var(--dynamic-vh)',
       },
+      minHeight: {
+        dvh: 'var(--dynamic-vh)',
+      },
       fontFamily: {
         pretendard: ['var(--font-pretendard-variable)'],
         jooree: ['var(--font-jooree)'],