fix

src/app/(pages)/layout.tsx

@@ -8,7 +8,9 @@ const Layout: React.FC<LayoutProps> = ({ children }) => {
     return (
         <>
             <Header />
-            {children}
+            <main className="flex-1 w-full max-w-3xl mx-auto px-4 py-8">
+                {children}
+            </main>
         </>
     );
 };

src/app/(pages)/page.tsx

@@ -1,8 +1,27 @@
-import Image from "next/image";
 import { NextPage } from "next";
+import Image from "next/image";
 
 const Home: NextPage = () => {
-    return <p>hello</p>;
+    return (
+        <>
+            <div className="w-full flex items-center gap-4 py-8">
+                <Image
+                    src="/images/icon.png"
+                    alt="icon"
+                    width={128}
+                    height={128}
+                    className="rounded-full"
+                />
+                <div>
+                    <h2 className="text-2xl font-bold">こんにちは！</h2>
+                    <p>
+                        はじめまして、tuna2134です。サーバーをいじったりするのが楽しいと思っている人間です！
+                    </p>
+                </div>
+            </div>
+            <p>hello</p>
+        </>
+    );
 };
 
 export default Home;

src/components/Header.tsx

@@ -1,8 +1,10 @@
 const Header: React.FC = () => {
     return (
         <header className="w-full flex flex-col items-center gap-1 py-4 border-b border-gray-400">
-            <small className="text-sm">tuna2134の休憩</small>
             <h1 className="text-4xl font-bold">tuna2134</h1>
+            <small className="text-sm text-gray-400/90">
+                tuna2134の個人的な憩いの場
+            </small>
         </header>
     );
 };