diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index f084e73..836818b 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -60,9 +60,9 @@
           class="bg-gray-800 text-white p-2 rounded-md border border-gray-700"
         />
       </label>
-      <button class="bg-gray-700 text-white p-2 rounded-full">
+      <a href="/settings" class="bg-gray-700 text-white p-2 rounded-full">
         <UserIcon width="1.5em" height="1.5em" color="#f0f0f0"/>
-      </button>
+      </a>
     </div>
   </nav>
 {/if}
diff --git a/src/routes/settings/+page.svelte b/src/routes/settings/+page.svelte
new file mode 100644
index 0000000..9784015
--- /dev/null
+++ b/src/routes/settings/+page.svelte
@@ -0,0 +1,24 @@
+<script>
+  const settingTypes = [
+    {
+      name: "Manage Type Filters",
+      path: "/settings/type",
+    },
+  ];
+</script>
+
+<div class="container mx-auto my-8 p-6 bg-gray-100 rounded-lg shadow-lg">
+  <h1 class="text-2xl font-bold mb-4 text-center">User settings</h1>
+  <div class="flex flex-col space-y-6">
+    {#each settingTypes as path}
+      <div class="flex items-center justify-center">
+        <a
+          href={path.path}
+          class="p-4 px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600"
+        >
+          {path.name}
+        </a>
+      </div>
+    {/each}
+  </div>
+</div>