diff --git a/examples/auth/nextjs/app/globals.css b/examples/auth/nextjs/app/globals.css
index 50bd9fc3356..f6aa6c3d551 100644
--- a/examples/auth/nextjs/app/globals.css
+++ b/examples/auth/nextjs/app/globals.css
@@ -25,18 +25,3 @@
     @apply border-foreground/20;
   }
 }
-
-.animate-in {
-  animation: animateIn 0.3s ease 0.15s both;
-}
-
-@keyframes animateIn {
-  from {
-    opacity: 0;
-    transform: translateY(10px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
diff --git a/examples/auth/nextjs/app/login/page.tsx b/examples/auth/nextjs/app/login/page.tsx
index 7358f05420d..37fc75d3095 100644
--- a/examples/auth/nextjs/app/login/page.tsx
+++ b/examples/auth/nextjs/app/login/page.tsx
@@ -74,7 +74,7 @@ export default function Login({
         Back
       </Link>
 
-      <form className="animate-in flex-1 flex flex-col w-full justify-center gap-2 text-foreground">
+      <form className="flex-1 flex flex-col w-full justify-center gap-2 text-foreground">
         <label className="text-md" htmlFor="email">
           Email
         </label>
diff --git a/examples/auth/nextjs/app/page.tsx b/examples/auth/nextjs/app/page.tsx
index 1881cc13f0f..25ea7680969 100644
--- a/examples/auth/nextjs/app/page.tsx
+++ b/examples/auth/nextjs/app/page.tsx
@@ -28,7 +28,7 @@ export default async function Index() {
         </div>
       </nav>
 
-      <div className="animate-in flex-1 flex flex-col gap-20 opacity-0 max-w-4xl px-3">
+      <div className="flex-1 flex flex-col gap-20 max-w-4xl px-3">
         <Header />
         <main className="flex-1 flex flex-col gap-6">
           <h2 className="font-bold text-4xl mb-4">Next steps</h2>
diff --git a/examples/auth/nextjs/app/protected/page.tsx b/examples/auth/nextjs/app/protected/page.tsx
index 1d73e55118b..72467cab06b 100644
--- a/examples/auth/nextjs/app/protected/page.tsx
+++ b/examples/auth/nextjs/app/protected/page.tsx
@@ -31,7 +31,7 @@ export default async function ProtectedPage() {
         </nav>
       </div>
 
-      <div className="animate-in flex-1 flex flex-col gap-20 opacity-0 max-w-4xl px-3">
+      <div className="flex-1 flex flex-col gap-20 max-w-4xl px-3">
         <Header />
         <main className="flex-1 flex flex-col gap-6">
           <h2 className="font-bold text-4xl mb-4">Next steps</h2>
diff --git a/examples/auth/nextjs/tailwind.config.js b/examples/auth/nextjs/tailwind.config.ts
similarity index 100%
rename from examples/auth/nextjs/tailwind.config.js
rename to examples/auth/nextjs/tailwind.config.ts