diff --git a/app.vue b/app.vue
index 63479f0..61334c5 100644
--- a/app.vue
+++ b/app.vue
@@ -6,3 +6,14 @@
     </NuxtLayout>
   </div>
 </template>
+<style>
+.page-enter-active,
+.page-leave-active {
+  transition: all 0.4s;
+}
+.page-enter-from,
+.page-leave-to {
+  opacity: 0;
+  filter: blur(1rem);
+}
+</style>
diff --git a/nuxt.config.ts b/nuxt.config.ts
index a3482d7..5012a3d 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,5 +1,8 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
+  app: {
+    pageTransition: { name: "page", mode: "out-in" },
+  },
   typescript: {
     strict: true,
   },