diff --git a/src/components/ContactForm.vue b/src/components/ContactForm.vue
index f5c209d..a285578 100755
--- a/src/components/ContactForm.vue
+++ b/src/components/ContactForm.vue
@@ -59,7 +59,12 @@
       {{ $t('contact.form.success') }}
     </div>
     <div class="my-12">
-      <button :disabled="!isSendable" :class="{'disabled': !isSendable}" @click.prevent="handleForm" class="font-bold px-6 py-3 border-2 rounded-full border-indigo-600 text-indigo-600 hover:(bg-indigo-600 text-white) hover:dark:text-black duration-300 cursor-pointer">
+      <button
+        :disabled="!isSendable"
+        :class="{'disabled': !isSendable}"
+        @click.prevent="handleForm"
+        class="font-bold px-8 py-4 border-2 rounded-xl border-indigo-600 text-indigo-600 hover:(bg-indigo-600 text-white) hover:dark:text-black duration-300 cursor-pointer"
+      >
         {{ $t('contact.form.submit') }}
       </button>
     </div>
diff --git a/src/components/Header.vue b/src/components/Header.vue
index f116a99..dd477c7 100755
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -7,31 +7,24 @@
       </nuxt-link>
       <nav class="right">
         <div class="flex flex-col md:flex-row items-center">
-          <ul class="flex text-lg">
-            <nuxt-link class="hidden md:inline-block" to="/about">
-              <li class="nav-link text-gray-500 dark:text-gray-400" :class="{'text-black dark:text-white': isWindow('/about')}">
-                {{ $t('header.about') }}
-              </li>
+          <div class="flex text-lg">
+            <nuxt-link class="nav-link hidden md:inline-block" to="/about">
+              {{ $t('header.about') }}
             </nuxt-link>
-            <nuxt-link class="hidden md:inline-block" to="/blog">
-              <li class="nav-link text-gray-500 dark:text-gray-400" :class="{'text-black dark:text-white': isWindow('/blog')}">
-                {{ $t('header.blog') }}
-              </li>
+            <nuxt-link class="nav-link hidden md:inline-block" to="/blog">
+              {{ $t('header.blog') }}
             </nuxt-link>
-            <nuxt-link class="hidden md:inline-block" to="/projects">
-              <li class="nav-link text-gray-500 dark:text-gray-400" :class="{'text-black dark:text-white': isWindow('/projects')}">
-                {{ $t('header.projects') }}
-              </li>
+            <nuxt-link class="nav-link hidden md:inline-block" to="/projects">
+              {{ $t('header.projects') }}
             </nuxt-link>
-            <nuxt-link class="hidden md:inline-block" to="/contact">
-              <li class="nav-link text-gray-500 dark:text-gray-400" :class="{'text-black dark:text-white': isWindow('/projects')}">
-                {{ $t('header.contact') }}
-              </li>
+            <nuxt-link class="nav-link hidden md:inline-block" to="/contact">
+              {{ $t('header.contact') }}
             </nuxt-link>
-          </ul>
+          </div>
         </div>
         <ul
-          class="dark:text-white dark:bg-black text-sm z-50 bg-white md:hidden fixed bottom-0 left-0 w-full flex items-center justify-around h-20 border-t border-gray-200 border-solid navbar-bottom-items">
+          class="dark:text-white dark:bg-black text-sm z-50 bg-white md:hidden fixed bottom-0 left-0 w-full flex items-center justify-around h-20 border-t border-gray-200 border-solid navbar-bottom-items"
+        >
           <nuxt-link to="/" class="w-1/5">
             <li class="h-full w-full font-medium flex flex-col items-center justify-center">
               <HomeIcon :active="isWindow('')"/>
@@ -140,7 +133,7 @@ export default defineComponent({
 
 <style scoped lang="scss">
 .nav-link {
-  @apply hover:dark:text-white font-medium hover:text-black mx-4 cursor-pointer duration-300
+  @apply font-medium cursor-pointer duration-300 mx-4 border-b-2 border-transparent hover:(border-indigo-600);
 }
 
 .navbar-bottom-items li {
diff --git a/tsconfig.tsbuildinfo b/tsconfig.tsbuildinfo
index 834ef8e..a31158c 100644
--- a/tsconfig.tsbuildinfo
+++ b/tsconfig.tsbuildinfo
@@ -1162,7 +1162,7 @@
         "affectsGlobalScope": false
       },
       "./src/components/ContactForm.vue.ts": {
-        "version": "b3b9943163e070a428cad62fc7126dfac7902f2723c46b0bbf47b31c3438582d",
+        "version": "766eb48f3d0995f6ef55606fcb49912b42ec9dc2e7567418bb3dd88f4c2e4ecd",
         "signature": "d26142bad7dcc401a5347b342131758b519cb8d5c00e5d1aa175bbc14d2ffb73",
         "affectsGlobalScope": false
       },
@@ -1222,7 +1222,7 @@
         "affectsGlobalScope": false
       },
       "./src/components/Header.vue.ts": {
-        "version": "64878f61fbde0a8d160ad19482a5b168d2f705ac1339405a20ce52c37ce22f82",
+        "version": "ff62dc9ee1f6df06c998324067ae193de46fe71f0540284aeb2f98bac67e1ba2",
         "signature": "a3ba6e4e90dedc9e3199dd5d1cad9c90318ca98c2a5a2c61edb4bbef88126797",
         "affectsGlobalScope": false
       },