diff --git a/package.json b/package.json
index 4f25f77..ef7b396 100644
--- a/package.json
+++ b/package.json
@@ -2,6 +2,8 @@
   "devDependencies": {
     "parcel": "^2.10.2",
     "postcss": "^8.4.31",
+    "prettier": "^3.1.0",
+    "prettier-plugin-tailwindcss": "^0.5.7",
     "tailwindcss": "^3.3.5"
   }
 }
diff --git a/src/index.html b/src/index.html
index 2526b82..37d1ede 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,16 +1,61 @@
 <!doctype html>
-<link rel="preconnect" href="https://fonts.googleapis.com">
-<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-<link href="https://fonts.googleapis.com/css2?family=Source+Sans+3&family=Work+Sans:wght@500;600&display=swap" rel="stylesheet">
-<link href="./index.css" rel="stylesheet">
+<link rel="preconnect" href="https://fonts.googleapis.com" />
+<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+<link
+  href="https://fonts.googleapis.com/css2?family=Source+Sans+3&family=Work+Sans:wght@500;600&display=swap"
+  rel="stylesheet"
+/>
+<link href="./index.css" rel="stylesheet" />
 <html lang="en">
   <head>
-    <meta charset="utf-8"/>
+    <meta charset="utf-8" />
     <title>My First Parcel App</title>
   </head>
-  <body>
-    <h1>Hello, World!</h1>
-    <!-- insert svg from public/logo.svg -->
+  <body class="flex h-screen justify-center items-center flex-col text-xl">
+    <div class="w-full h-full flex justify-center flex-wrap p-4 gap-10 items-center">
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+    </div>
     <img class="max-w-2xl" src="public/logo_main.svg" alt="parcel logo" />
+    <div class="w-full h-full flex justify-center flex-wrap p-4 gap-10 items-center">
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+      <a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
+        <div class="absolute bg-black -z-10 w-full h-full"></div>
+        Facebook
+      </a>
+    </div>
   </body>
-</html>
\ No newline at end of file
+</html>
