diff --git a/.gitignore b/.gitignore
index 8cb8314..53ff253 100644
--- a/.gitignore
+++ b/.gitignore
@@ -24,3 +24,4 @@ logs
 !.env.example
 
 .husky/_/
+.vscode/
diff --git a/app.vue b/app.vue
index e002d88..dd4ef89 100644
--- a/app.vue
+++ b/app.vue
@@ -2,7 +2,6 @@
   <NuxtLayout>
     <NuxtPage />
     <SpeedInsights />
-
     <UNotifications />
   </NuxtLayout>
 </template>
diff --git a/assets/css/main.sass b/assets/css/main.sass
index eb4a921..29fef05 100644
--- a/assets/css/main.sass
+++ b/assets/css/main.sass
@@ -1,3 +1,24 @@
 .dark 
   @apply bg-slate-950
   @apply text-slate-100
+
+.page-enter-active,
+.page-leave-active
+  @apply transition-all
+  @apply duration-300
+
+.page-leave-to,
+.page-enter-from
+  @apply opacity-0
+
+.page-enter-active
+  @apply ease-out
+
+.page-leave-active
+  @apply ease-in
+
+.page-leave-to
+  @apply -translate-y-6
+
+.page-enter-from
+  @apply translate-y-6
diff --git a/nuxt.config.ts b/nuxt.config.ts
index c5f1f50..0084b3e 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -8,9 +8,8 @@ export default defineNuxtConfig({
     { path: '@/components/content', pathPrefix: true },
   ],
   app: {
-    head: {
-      htmlAttrs: { lang: 'en' },
-    },
+    head: { htmlAttrs: { lang: 'en' } },
+    pageTransition: { name: 'page', mode: 'out-in' },
   },
   modules: [
     '@nuxt/ui',